Begginer's problem .. [wordpress template] One class ignored out of two

Discussion in 'CSS' started by krembo99, Mar 23, 2008.

  1. #1
    Hello people.
    I am having a problem which drives me crazy.
    I am making my third wordpress template now, the simplest EVER. but somehow, this simple one is the one who is giving me the hardest time.
    I am using only two classes on this page . "item" and " categor" , all the otehr classes are for the header part of the document (which has only one other and is very simple)
    The problem is , somehow the "categor" class is being ignored and gets the browser's default. no matter what i do. it is obviously a hirerchy problem of nested something , but what ?
    (Sorry I do not have a URL, it is being developed on Local machine)

    this is the PHP (or html)
    
    
    <link href="style.css" rel="stylesheet" type="text/css" />
    <p><table width="100%" align="center" >
    <tr>
    <td width="58%" align="left"><a class="item" href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></td>
    <td width="42%" align="left" ><a class="categor"><?php the_category(', ') ?></a></td>
    </tr>
    </table></p>
    
    
    Code (markup):
    and this is the CSS

    
    
    body {
    background-color: #000000;
    margin-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    vertical-align: top;
    }
    
    
    
    .blogname {
    
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 30px;
    font-style: normal;
    font-weight: normal;
    color: #FFFFFF;
    text-decoration: none;
    }
    
    p.blogname {
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 18px;
    font-style: normal;
    font-weight: normal;
    color: #999999;
    text-decoration: none;
    }
    
    p.blogname:hover {
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 18px;
    font-style: normal;
    font-weight: normal;
    color: #FFFFFF;
    text-decoration: none;
    }
    
    .blogname:visited {
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 30px;
    font-style: normal;
    font-weight: normal;
    color: #FFFFFF;
    text-decoration: none;
    background-color: #FF0000;
    }
    
    .blogname:hover{
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 30px;
    font-style: normal;
    font-weight: normal;
    color: #FFFFFF;
    text-decoration: none;
    background-color: #666666;
    }
    
    .item {
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 30px;
    color: #FFFFFF;
    text-decoration:none}
    
    .item:link{
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 30px;
    color: #FFFFFF;
    text-decoration:none}
    
    
    .item:visited {
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 30px;
    color: #FFFFFF;
    text-decoration: line-through;
    }
    
    .item:hover {
    
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 30px;
    font-style: normal;
    font-weight: normal;
    color: #FFFFFF;
    text-decoration: none;
    background-color: #FF0000;
    }
    
    .categor {
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 12px;
    color: #FFFFFF;
    text-decoration:line-through;
    }
    
    .categor:hover {
    
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 12px;
    font-style: normal;
    font-weight: normal;
    color: #FFFFFF;
    text-decoration: none;
    }
    
    .categor:visited {
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 12px;
    color: #FFFFFF;
    text-decoration: line-through;
    }
    
    
    Code (markup):
     
    krembo99, Mar 23, 2008 IP
  2. topperharley122

    topperharley122 Peon

    Messages:
    4
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Try changing the class names to :

    a.categor

    a.categor:hover

    a:categor:visited
     
    topperharley122, Mar 23, 2008 IP
  3. krembo99

    krembo99 Peon

    Messages:
    3
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    I have resolved it somehow :

    I changed this :
    <td width="42%" align="left" ><a class="categor"><?php the_category(', ') ?></a></td>
    Code (markup):
    with that :
    <td width="42%" align="left" class="categor"><a ><?php the_category(', ') ?></a></td>
    Code (markup):
    I just put the second class inside the "TD" instead of inside the "a"
    Still have no idea though why it happens. two classes, almost identical, one has to be inside the "td" and one inside the "a"
     
    krembo99, Mar 23, 2008 IP
  4. Ikki

    Ikki Peon

    Messages:
    474
    Likes Received:
    34
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Your problem is that the second link doesn't have an href attribute. That's why your browser isn't "styling" it.
     
    Ikki, Mar 24, 2008 IP
  5. krembo99

    krembo99 Peon

    Messages:
    3
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #5
    Thanks for your reply.
    Well, In my desperation, I even tried to put a dummy link , and it did not help.
    And by the way , the PHP bit you see there DOES create a link (to the categories)
    Like I said , the problem for me is resolved but if someone has an idea as to why it happened, I would like to know to :)
     
    krembo99, Mar 24, 2008 IP