Hi Jerome,
I had the same problem some time ago - so long ago, I'm no longer sure
exactly what actually fixed it. However, I think the answer, or part of
it, involves setting display:inline on the <li>, not the <a> and then
setting your padding, etc. on the <a>. I also found I had to set a line
height for my <a>. Using a font size of 1.2em, a line height of 1.6em
seemed to do the trick, although why I have no idea!
Hope this helps.
Lesley
Jerome Carpen wrote:
hey guys,
Have got the following navigation to work in firefox, safari, chrome, opera and the such, but not IE.
In IE, the links do not go inline but scale left to right in a step manner.
Any ideas of what i'm missing?
==========HTML================
<ul class="navlist">
<li><a href="#">Link1</a></li>
<li><a href="#">Link2</a></li>
<li><a href="#">Link3</a></li>
<li><a href="#">Link4</a></li>
</ul>
==========CSS================
#nav {
background-color: #930;
float: left;
width: 600px;
}
.navlist {
list-style-type: none;
}
.navlist li a {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 24px;
color: #FFF;
text-decoration: none;
display: block;
float: left;
padding-right: 20px;
padding-left: 20px;
}
.navlist li a:hover {
color: #0F3;
}
*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [email protected]
*******************************************************************
*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [email protected]
*******************************************************************
