Could you help me fix the menu on this this page? The menu list items don’t have a width defined, so they display at 100% width in IE7. If I make the span.right have a float: left, it fixes the problem, but then the rounded corners don’t work. A possible solution might be to get rid of the right span and set a padding and background image to the anchor, but that will: a) prevent me from being able use to a background image on the anchor (for this instance, I suppose a solid color will do) and b) require that I break menu.png into separate image files.
If you guys have any good suggestions, let me know. Thanks!
If you move the actual text to the middle, between
<span class='left'></span>and<span class='right'></span>, and encompass it in<span>tags:You can then add the CSS rule:
Then remove
float: left;fromspan.leftandspan.right. This should work fine on both Firefox and IE 7, and I’m assuming most other browsers too. Of course, this will only work if you’re OK with restructuring the HTML a little.