I designed a simple horizontal bar in CSS for my site and its fine in all browsers, except IE6 and IE7. I read somewhere that IE doesn’t like “block” and “float” properties, but this is the only way you can force your navigation in vertical line. Could anyone help please. This is my CSS code for my navigation.
#navigation {
height: 50px;
width: 800px;
float: left;
border: 1px solid #006;
background-image: url(Images/navigation_transparent.png);
margin-top: 20px;
}
#navigation ul {
margin: 0px;
padding: 0px;
list-style-type: none;
}
#navigation ul li a {
text-align: center;
display: block;
padding: 10px;
float: left;
height: 20px;
width: 120px;
font-family: “Trebuchet MS”, Arial, Helvetica, sans-serif;
font-size: 18px;
font-weight: normal;
overflow: hidden;
zoom: 1; /* for IE 6 */
}