Forums

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

Home Forums CSS navigation woes

  • This topic is empty.
Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #39914
    cybershot
    Participant

    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/

    #110310
    chrisburton
    Participant

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

    #110313
    chrisburton
    Participant

    @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.

    #110314

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

    #110429

    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

    #110427
    Paulie_D
    Member

    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

    #110466
    Senff
    Participant

    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/

    #110503
    matt_sanford
    Participant

    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.