Forums

Give help. Get help.

  • # September 18, 2012 at 9:25 pm

    This seems to happen to me every single time I code navigation. I really hate coding navigation. I can’t figure out what I am doing wrong. The last link in the nav always behaves like it ran out of room and gets cut off even though I have not specified a width on the navigation div or the UL. What is it that is happening?

    http://jsfiddle.net/r4Twt/

    # September 18, 2012 at 9:34 pm

    Look at the span (I gave it a background). http://jsfiddle.net/Daqp5/

    # September 18, 2012 at 10:23 pm

    @cybershot How do we know if you need to float those spans or not? Upload the images so we know what you’re trying to accomplish with the backgrounds.

    # September 18, 2012 at 10:25 pm

    I’ve made a few changes for you: http://jsfiddle.net/joshnh/Gfxc2/

    # September 20, 2012 at 7:32 am

    There doesn’t appear to be any fixed width so I cannot determine why your menu is not expanding as it should. The example I made seems to work just fine. I have also removed the SPANS that were flanking your menu and replaced them with :before and :after pseudo thingies (technical term).

    http://jsfiddle.net/Gfxc2/18/

    * Tested in FF and IE8

    # September 20, 2012 at 8:11 am

    Is there not just a simpler option of adding a padding to the #navigation, a border-radius on that and then just a gradient?

    http://codepen.io/Paulie-D/pen/phnCv

    # September 20, 2012 at 9:46 pm

    If you assign a float:left; to the UL, it will probably do what you want it to. Since you use the spans on either side to float with the UL, it makes sense to make the UL itself float too.

    Maybe remove the right margin from the last item as well.

    Like this: http://jsfiddle.net/senff/r4Twt/2/

    # September 21, 2012 at 10:34 am

    the more floats you have to keep track of, the harder it is to make it work. I use to have the same problem so instead what i did was got rid of the div that was wrapping my navigation and just added a class or id to the ul itself. Saves a lot of time. Here is your fiddle, http://jsfiddle.net/r4Twt/13/

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.

icon-anchoricon-closeicon-emailicon-linkicon-logo-staricon-menuicon-nav-guideicon-searchicon-staricon-tag