WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] wp_nav_menu after? (7 posts)

  1. ironfenix
    Member
    Posted 3 years ago #

    Hi All,

    I'm trying to add vertical lines after my footer links, I've got it working by using:

    <?php wp_nav_menu(array('after' => '|')); ?>

    How ever this also adds a vertical line after the last link, which I don't want there, is there a way to exclude the after if last link?

    Cheers for the help in advance.

  2. Sennza Pty Ltd
    Member
    Posted 3 years ago #

    Hey ironfenix,

    I've had to do that in the past for a few sites and I tackled it a little differently. Rather than using a pipe '|' I would use CSS and utilising a
    border-right:1px solid #fff; substituting #fff with whatever colour you want.

    You'll still get the same result with an extra one at the end so you can either use something like #menu li:last-child { border-right:0; } and that'll get rid of the last one in some browsers.

    Some versions of IE don't recognise the :last-child pseudo class.

    You might need to add some jQuery if you need to deal with that. Something like:

    jQuery(document).ready(function($) {
    jQuery("#nav li:last").css({'border-right':0});
    });

    Should deal with it I think :)

  3. ironfenix
    Member
    Posted 3 years ago #

    Brilliant why didn't think of the simple things first ha!

    However if anyone else is stuck with this, heres the solution thats browser friendly without jquery:

    li {
    	list-style-type: none;
    	display:inline;
    	border-left:1px solid #000000;
    }
    
    li:first-child {
    
    	border-left: 0;
    
    }

    As IE 7+/ Opera / Safari / Chrome / FireFox all support first-child but don't support last-child.

    Thanks Bronson

  4. Sennza Pty Ltd
    Member
    Posted 3 years ago #

    Ahh nice thinking on the first-child idea! :)

    No worries. Happy to help!

  5. chrisboggs
    Member
    Posted 3 years ago #

    @ironfenix,
    Thanks a bunch for that bit of info on IE 7+/ Opera / Safari / Chrome / FireFox support of first-child. I thought I was crazy when I couldn't get last child to work, ha ha ha!

    Thanks man. -c-

  6. rizkix
    Member
    Posted 3 years ago #

    this really help me

    Thanks all

  7. Jim
    Member
    Posted 2 years ago #

    @ironfenix

    Thanks for the fix. I've been chasing my tail with last-child.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.