1.

Solve : Fire Fox Compatibility?

Answer»

I created a menu using Divs and basic CSS. While testing my code in diffrent browers I keep RUNNING into the problem that my width property for the menu isnt working on firefox. I'm guessing firefox doesnt support width so my question is whats the best way to fix this problem?

Code: [Select]
#lmenu {position: absolute; top: 150px; left: 150px;}
#lmenu ul li {display:INLINE; list-style:none}
#lmenu ul li a:link, #lmenu ul li a:visited{text-decoration: none; font-family: sans-serif;
background-COLOR: white; width: 150px; padding:10px; text-align:center;
border:2px solid black; font-variant: small-caps; color:BLUE}
#lmenu ul li a:hover{border-right: 1px solid black; border-bottom:1px solid black; color:white;
background-color: blue;}
HTML
Code: [Select]<div id="lmenu">
<ul>
<li><a href="#">Home Page</a></li>
<li><a href="#">Information</a></li>
<li><a href="#">Hours</a></li>

<li><a href="#">Contact</a></li>
</ul>
</div>
You've already set #lmenu ul li to display inline, therefore you can't set the width of that element.  Any browser that complies with your width specification is breaking CSS; Firefox is BEHAVING as it should.  Set the width at the DIV level, not at the LI level.



Discussion

No Comment Found