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 3 of 3
  1. #1
    Registered User
    Join Date
    Jun 2011
    Posts
    1,063
    Thanks
    12
    Thanked 241 Times in 240 Posts

    Opposite Selector +



    I'm using a little padding to space the tab next to the selected tab (white), since I'm using a width on the <a> to give it a more "equal look". So I'm using + to select the next tab in order to push it over to the right (by 5 px). However, if a tab other than the first is selected, the tab to the left also needs to be pushed. My question is what is the selector to choose the tag before? I tried :before but it didn't seem to have an effect. My question really isn't about an alternate solution, I'm more interested in the selector to use.

    - thanks

    Code:
    #mastHead .bin,
    #mastHead .bin ul.nav,
    #mastHead .bin ul.nav li,
    #mastHead .bin ul.nav li a {
    	height: 28px;
    }
    
    #mastHead .bin ul.nav {
    	font-size: 13px;
    }
    
    #mastHead .bin ul.nav li a {
    	color: #EEE;
    	font-weight: bold;
    	line-height: 28px;
    	width: 80px;
    	text-align: center;
    }
    
    #mastHead .bin ul.nav li.selected + li a {
    	padding-left: 5px;
    	padding-right: 1px;
    }
    Last edited by Sammy12; 07-21-2011 at 03:14 AM.

  • #2
    Regular Coder djh101's Avatar
    Join Date
    May 2009
    Location
    California
    Posts
    616
    Thanks
    48
    Thanked 65 Times in 65 Posts
    "Yeah science!"
    Online Science Tools

  • #3
    Regular Coder Lerura's Avatar
    Join Date
    Aug 2005
    Location
    Denmark
    Posts
    901
    Thanks
    0
    Thanked 118 Times in 117 Posts
    unfortunately there is not yet an opposite to +

    :before is not a selector, it is a pseudo-element.

    It is used when you want to add content before the original content of the specified element.
    e.g.
    Code:
    <style>
    div:before {content: "Mega"}
    </style>
    <div>bomb</div>
    will act as if you have written
    Code:
    <div>Megabomb</div>


  •  

    Posting Permissions

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