I can't replicate this but I've had two different people on IE7 tell me that the menu bar links on my site are collapsed. Tried using a browser tester (Litmus) and my own IE7 install and still couldn't replicate.

I'm using .cornerz jQuery plugin to created rounded corners on these links, which are simply A tags with no space between them.

you're welcome to look at the source code and CSS file; the problem area is in the #tabs div

not sure what I'm doing wrong...there has to be some type of padding or margin issue that's causing the tabs to all collapse on each other.

2 answers

Guffa 316

They may actually be IE8 users without knowing it... in IE8 the menu items are crumbled up in a pile to the right.

The problem is most likely that you are applying the rounded corner script to the anchor tags. It adds div elements inside the anchor, but as the anchor tag is an inline element it may not contain block elements. Thus, the HTML becomes invalid.

Put div elements around the anchor tags that you can apply the rounded corners to, or use a different method of creating the rounded corners that doesn't add block elements.

Answered over 9 years ago by Guffa
  • that does make more sense. So if I created the corners off of a list and then put the anchor tags inside the < li > that would be more likely to work? [aside: I haven't tried any other corner plugins but in either case your point about where I'm applying the corner makes sense] Stephan Hovnanian over 9 years ago
danwellman 5600

I find that HTML comments left in empty elements can help these kinds of problems, especially with inline elements (although it may not necessarily fix this particular issue)

<a href="" title=""><!-- w00t --></a>
Answered over 9 years ago by danwellman
  • Did you look at his code? There are no empty elements. This answer is not helpful in any way. -1 Abinadi Ayerdis over 9 years ago