Results 1 to 3 of 3

Thread: CSS highlight menu question

  1. #1
    Join Date
    Jul 2005
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question CSS highlight menu question

    Is it possible to make the highlight menu different colors on the same page? I ask this because I have catagorized my menu into three parts, and want each part to be a different color. (My site is http://www.peacebears.com)
    I've messed around with the coding, but nothing I've tried seems to help.
    Any ideas?

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,496
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Create additional classes in the style section, use those new class names for different color effects. Ex:
    Code:
    <style>
    A.menulink {
    display: block;
    width: 198px;
    text-align: left;
    text-decoration: none;
    font-family:arial;
    font-size:12px;
    color: #000000;
    BORDER: none;
    border: solid 1px #FFFFFF;
    }
    
    A.menulink:hover {
    border: solid 1px #6100C1;
    background-color:#F0E1FF;
    }
    
    A.menulink1 {
    display: block;
    width: 198px;
    text-align: left;
    text-decoration: none;
    font-family:arial;
    font-size:12px;
    color: #000000; /* change this for a different color text */
    BORDER: none;
    border: solid 1px #FFFFFF;
    }
    
    A.menulink1:hover {
    border: solid 1px #6100C1;
    background-color:#F0E1FF; /* change this for a different color highlight */
    }
    
    </style>
    Then use the 'menulink1' class with those links that you want to be different:
    Code:
    <td width="100%"><a href="http://www.javascriptkit.com" class="menulink1" class=&{ns4class};>JavaScript Kit</a></td>
    You can add more classes if you want, just keep incrementing the number:
    Code:
    A.menulink2 {
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Jul 2005
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks! I'd tried similar things, but I had tried that.
    Thanks again!

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •