My navigation menu works perfectly across browsers except for IE7.
I'm using inline-block to float list items, but this isn't supported in IE. I've tried some workarounds, but they all have issues - especially because inline-block wraps the list item around its content, which these other methods don't do. Setting a specific width isn't ideal since this site is not static.
<ul id="mini-nav">
<li class="">
<a href="">authenticated/basic">BASIC</a>
<div></div>
</li>
<li class="">
<a href="">ADVANCED</a>
<div></div></li>
<li class="">
<a href="">BEST PRACTICES</a>
<div></div>
</li>
</ul>
I want my list items to expand based on the size of the text in the links. How can I achieve this without using inline-block?