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

    Join Date
    Dec 2012
    Posts
    1
    Rep Power
    0

    Unhappy CSS Navigation Bar


    Good day! I used CSS navigation bar on designing my webpage and I placed it on top but it applied to all the links in my unpublished webpage.. all the links turned like the links on the navigation bar..How to exclude the other links in this navigation bar links' style?
  2. #2
  3. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2011
    Location
    The Pleiades
    Posts
    299
    Rep Power
    9
    Can you post your code?

    Also, to target only the links inside your navigation you need to specify that within your CSS.

    Let's say your navigation links are inside a <div> or a <nav> tag, give it an id. such as:
    Code:
    <div id="navigation">
    <a href="">Link 1</a>
    <a href="">Link 2</a>
    <a href="">Link 3</a>
    </div>
    
    <!-- OR -->
    
    <nav id="navigation">
    <a href="">Link 1</a>
    <a href="">Link 2</a>
    <a href="">Link 3</a>
    </nav>
    You need to write the CSS like so:
    Code:
    #navigation a
    {
         
    }
    
    //OR
    
    #navigation > a
    {
         //this targets only the <a>tags which are direct children of the <nav> or <div>
        //this is best used when you could have another div INSIDE your 
    #navigation div and would like to stop them from getting the same
     styles (because they won't be direct children, the div you put
     them in will be the direct child of #nav)
    }
    Hope this helps, if you post your code, I will sort it out for you dude.

    Kind regards,

    NM.
    Last edited by Nanomech; December 29th, 2012 at 03:45 AM.

IMN logo majestic logo threadwatch logo seochat tools logo