CSS Menu Bug - phantom <li> shows up in some browsers

topic posted Fri, November 9, 2007 - 7:33 AM by  offlineBrettFromTibet
Share/Save/Bookmark
Advertisement
I am making a simple site, and I added a CSS rollover menu I yanked from an open source template.

rolfinginboulder.com

The home page works fine on most browsers, but all of the other pages have a weird phantom menu item quirk
in some versions of Firefox and Safari - (EVEN THOUGH THE CSS COODE IS IDENTICAL).

What happens is that extra blank menu items sometimes get added to the nav bar, even though there seems to be nothing extra in the code to warrant it:

rolfinginboulder.com/about.html

The code is very simple, and the CSS is in the header. Can anyone figure out how to fix this? The client is going to appear on TV and plug his website next Friday.. and it would be way rad to have this fixed.

Muchos domo arigatos,

Brett
posted by:
BrettFromTibet
Denver
Advertisement
Advertisement
  • Brett,
    I don’t design for bucks (hopefully someday). I don’t readily see the specific cause of having two blank spaces in your nav bar - but some observations (I’m using latest FireFox):

    - Some of the menu items don’t go anywhere
    - Your doc type is “strict” but Xhtml validation fails – numerous errors

    What I like to do:
    - Create pages that validate (the validator helps me troubleshoot).
    - Have one external style sheet

    So, if it were me (which it aint):
    - I would pull the inline style out and just link to one external style sheet
    - Tidy up your code – make sure it validates without errors (go with Transitional doc type if necessary).
    - check all the links

    Even if doing all the above doesn’t solve your problem (be slightly surprised if it doesn’t), you will have cleaner document and it will be easier to trouble shoot any remaining probs.

    Thoughts from a wana-be page builder for hire,

    Will
  • Hola neighbor :-)

    I'd agree with Will on most counts (especially having so much css on the page itself). Also, you might note that you misspelled "index" (inex.html) in the link code

    I couldn't, however, get an additional list item to appear in any browser I checked (Safari, Firefox, ie 5.2, Opera, Netscape... all Mac)

Recent topics in "HTML Coding"

Topic Author Replies Last Post
Favicon Replacement Jim 1 November 27, 2009
Im in the wrong tribe Hjiørst 1 October 12, 2009
New to XHTML Sierra 5 March 10, 2009
Form not working Ariana 2 February 25, 2009