Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home › Forums › CSS › Correct Way To Add a Bottom Border Between Nav Items?

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • April 27, 2013 at 6:09 pm #44404
    MBM
    Participant

    I want to add a bottom border between nav items :

    div.navborder {
    margin-left:50px;
    padding-top:20px;
    width:200px;
    border-top:1px solid #000000;}

    Fails navigation :

    Line 42, Column 23: Element div not allowed as child of element ul in this context. (Suppressing further errors from this subtree.)

    What’s the correct way to do this? Can it be done without nesting two menus in divs?

    April 27, 2013 at 6:17 pm #133383
    chrisburton
    Participant

    I guess you could use `:nth-child():after`.

    Something like:

    #navigation li:nth-child(7):after {
    content: “”;
    display: block;
    margin-left:50px;
    padding-top:20px;
    width:200px;
    border-top:1px solid #000000;
    }

    April 27, 2013 at 6:40 pm #133385
    MBM
    Participant

    Perfect! Made a couple of adjustments :

    #navigation li:nth-child(7):after {
    content: “”;
    display: block;
    margin-top:20px;
    width:200px;
    border-top:1px solid #000000;
    }

    Live here : http://mbmitservices.co.uk/pcommerce/index.html

    Thank you.

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘CSS’ is closed to new topics and replies.