#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Mar 2001
    Posts
    8
    Rep Power
    0

    Separate CSS for tables?


    Hello

    I would like to have what amounts to a completely separate style for a table.

    I have been trying to make a class but it won't work with with pseudo-classes. I can't find the answer in any of my instruction material.

    How do I do this?

    Thanks much in advance!
  2. #2
  3. Corporate Stooge
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jun 2001
    Location
    Aberdeen, Scotland
    Posts
    134
    Rep Power
    14
    You can assign different styles to all HTML tag.

    e.g.

    TABLE
    {
    font-size: 10px;
    font-color: "#0e0e0e"
    }
    Never sign your code....it leaves you liable!
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Mar 2001
    Posts
    8
    Rep Power
    0
    Thanks noodles

    It's just that I want the styles to work with one table only. I do have a style for table already.

    The biggest problem seems to be with things such as the "a" pseudo-class selectors which, in the following case, the a:link, for instance, takes over the whole page even though it is in a class.

    I am putting the class in the table tag <.table class="main3">

    .main3 {
    background: orange;
    a:link {color: blue;}
    a:visited {color: red;}
    a:hover {background: blue;}
    }
    (colors for testing purposes)
  6. #4
  7. No Profile Picture
    Contributing User
    Devshed Intermediate (1500 - 1999 posts)

    Join Date
    Nov 2001
    Posts
    1,882
    Rep Power
    20
    <html>
    <head>
    <title>Untitled Document</title>
    <style>
    .main3 { background: orange;}
    .main3 a:link {color: blue;}
    .main3 a:visited {color: red;}
    .main3 a:hover {background: blue;}
    }

    a:link {color: green;}
    a:visited {color: black;}
    a:hover {background: black;}
    </style>
    </head>

    <body bgcolor="#FFFFFF" text="#000000">
    <table width="200" border="1" cellspacing="0" cellpadding="0" class="main3">
    <tr>
    <td>
    <p>Text</p>
    <p><a href="#">Link</a></p>
    </td>
    </tr>
    </table>
    <p>Text </p>
    <p><a href="#">Link</a></p>
    </body>
    </html>
  8. #5
  9. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Mar 2001
    Posts
    8
    Rep Power
    0
    Thank you very much!
  10. #6
  11. No Profile Picture
    Contributing User
    Devshed Intermediate (1500 - 1999 posts)

    Join Date
    Nov 2001
    Posts
    1,882
    Rep Power
    20
    No probs

    .main3 a:hover {background: blue;}
    }
    That last } is a typo. It is redundant.

IMN logo majestic logo threadwatch logo seochat tools logo