Funky Floating Last List Link

design

#1

I’ve got a template working beautifully in almost every browser except opera, and I haven’t the foggiest clue what’s wrong. The last link in the menu at the top will always drop down so the top is level with the bottom of the rest of the links:
how it’s supposed to look
how it does look

I’m not sure if this is a bug in Opera 9 or my CSS is bad (saying that 9 just came out). The relevent CSS in the stylesheet should be all the stuff for #mainmenu. Anyone have this problem before?

Satyagraha


#2

Hey, I’m getting a 404 on those images… but to me it sounds like a float bug. There’s probably nothing wrong with the code, but Opera 9 and IE usually do something like this:
If links are listed as list items and floated, at the end of the list tags, x amount of the last display characters of text (it’s 2 for every li in Internet Explorer, not sure about Opera9) are repeated as a new list item, but are not selectable (like text) and not navigable (like links).
I’m not sure exactly what causes this, but the problem goes away if you don’t use them as a list. A list may be convenient at first, but it’s usually unecessary, and, as you can see, it gives you that much more mark-up for something to go wrong with.
If a list is necessary, then try putting a long comment just before your closing ul or ol tag; I seem to remember reading something about that hack a few months ago. The bigger problem here is Internet Explorer (most likely most of your traffic), and this bug still exists even in the IE7 Beta (better CSS my ass).
Let me know if this was any help to you,
~ken