Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    Regular Coder
    Join Date
    Mar 2011
    Posts
    215
    Thanks
    10
    Thanked 1 Time in 1 Post

    Using 2 classes on one selector

    I have a navigation that uses the property last, and active. last makes the last list item have no border on the right, active changes the color of the selector when its active. I have one item on my site at trendstudiosorlando.com that uses both,

    My classes are
    Code:
    #navigation li a.last {
    border-right:none;
    }
    
    #navigation li a.active{
    		color: #609;
    	}
    And here is the call of them
    Code:
    <li ><a class="active last" href="parties.html" title="Parties">Parties</a></li>
    Right now, while the active class works on this, the last is not. Any reason why?

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,866
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    The right border is applied on the list items and so you need to .last last <li> of the navigation. It's correct on all pages except the last page - parties.

    PS: Make use of some serverside code (PHP, JSP< ASP) to include a file (with the markup for navigation), on all pages. This will save a lot of time at your end.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    Regular Coder
    Join Date
    Mar 2011
    Posts
    215
    Thanks
    10
    Thanked 1 Time in 1 Post
    Im not sure I understand, sorry.

  • #4
    New Coder
    Join Date
    Apr 2012
    Posts
    44
    Thanks
    0
    Thanked 14 Times in 14 Posts
    The class .active needs to be on your <li> and not on you <a>.

    You can also use :last and :active as selectors instead of using them as class. Most of the time is easier and cleaner!

    Good luck!

    P.S.: Your contact form is almost invisible. Your design is clean, and all the focus should be on that form. ;p
    Last edited by Xherdas; 10-01-2012 at 10:50 PM.

  • #5
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,930
    Thanks
    6
    Thanked 1,041 Times in 1,014 Posts
    Quote Originally Posted by Xherdas View Post
    You can also use :last and :active as selectors instead of using them as class.
    No, you can’t.
    1. There is no :last pseudo-class/selector in CSS. There is :last-child but it’s not supported in IE8, so you definitely need another selector for that.
    2. The :active pseudo-class only applies to links while they are clicked, not to “current page” items.

  • #6
    Regular Coder
    Join Date
    Mar 2011
    Posts
    215
    Thanks
    10
    Thanked 1 Time in 1 Post
    So then how do I put the 2 classes on that one selector?

  • #7
    Senior Coder DanInMa's Avatar
    Join Date
    Nov 2010
    Location
    Salem,Ma
    Posts
    1,577
    Thanks
    13
    Thanked 248 Times in 248 Posts
    Code:
    #navigation li a.active.last
    is this what you mean?


  •  

    Posting Permissions

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