• Resolved nadine00

    (@nadine00)


    Hey,

    Probably a simple solution to this, but am currently surfing around for one. Right now i’m using this tag to show a top horizontal navigation menu:

    <?php wp_page_menu('exclude=35,57'); ?>

    and this css to style it

    #nav li {
    	display: inline;
    	margin: 0 5px 0 5px;
    	padding: 0 10px 0 0;
    	border-right: 1px solid black;
    }

    So I get:

    option 1 | option 2 | option 3 | option 4 |

    normally to get rid of the last divider line, I would make a class and apply it to the last element:

    .last { border-right: none;}

    So I get:

    option 1 | option 2 | option 3 | option 4

    How do I go about that using that above wordpress tag?

    Thanks!

    Nadine.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The short answer is – you can’t. You might be able to set a border-left on each of the menu <li></li> tags using CSS and then immediately after that, try removing the border-left on the first list item using the :first-child pseudo class.

    Thread Starter nadine00

    (@nadine00)

    Thanks esmi.

    That tip about :first-child lead me to find :last-child. So all I had to do was say li:last-child {border-right: none;} and it worked…well not in IE…but for now it will work.

    cheers.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘removing a divider line at the end of a nav menu’ is closed to new replies.