Erro em Menu (Float dá erro no IE)
Pessoal, estou fazendo uns testes em CSS para um site, e no Firefox está tudo funcionando as 1000 maravilhas, mas no IE não. Tenho um menu horizontal com 4 "botões", q deveriam ficar alinhados, um ao lado do outro (exatamente como no Firefox), mas no IE eles estão ficando um embaixo do outro, alinhados a esquerda da tela, como se fosse um menu vertical. O endereço do site é http://www.augustolohmann.com.br/slavian/
Segue abaixo o código do CSS q regula esse menu. O 1º botao está com o div do menu1, o 2º botao está com o div do menu2, e assim vai...
/**************************************************************
Top Block Menu
**************************************************************/
#menu {
margin: 0 auto;
}
#menu ul {
width: 25%;
float: left;
margin: 0;
padding: 0;
text-align: left;
background: #000 url(../images/bg/menu.gif) repeat-x top left;
}
#menu ul li {
display: inline;
margin: 0;
padding: 0;
list-style: none;
}
#menu ul li a {
float: left;
width: 100%;
height: 4.5em;
font: 400 1.2em arial, sans-serif;
letter-spacing: 0.1em;
color: #fff;
border-top: 7px solid #DBEAEA;
border-bottom: 15px solid #FFF;
}
#menu ul li a span {
display: block;
padding: 2px 7px;
}
#menu ul li a span.desc {
font-size: 0.8em;
color: #8C8D94;
}
#menu ul li a:hover,
#menu ul li a.here {
background: #CCCCCC;
border-top: 7px solid #009933;
}
#menu ul li a:hover span.desc,
#menu ul li a.here span.desc {
color: #FFF;
}
/**************************************************************
Top Block Menu 2
**************************************************************/
#menu2 {
margin: 0 auto;
}
#menu2 ul {
width: 25%;
float: left;
margin: 0;
padding: 0;
text-align: left;
background: #000 url(../images/bg/menu.gif) repeat-x top left;
}
#menu2 ul li {
display: inline;
margin: 0;
padding: 0;
list-style: none;
}
#menu2 ul li a {
float: left;
width: 100%;
height: 4.5em;
font: 400 1.2em arial, sans-serif;
letter-spacing: 0.1em;
color: #fff;
border-top: 7px solid #DBEAEA;
border-bottom: 15px solid #FFF;
}
#menu2 ul li a span {
display: block;
padding: 2px 7px;
}
#menu2 ul li a span.desc {
font-size: 0.8em;
color: #8C8D94;
}
#menu2 ul li a:hover,
#menu2 ul li a.here {
background: #CCCCCC;
border-top: 7px solid #FFCC00;
}
#menu2 ul li a:hover span.desc,
#menu2 ul li a.here span.desc {
color: #FFF;
}
/**************************************************************
Top Block Menu 3
**************************************************************/
#menu3 {
margin: 0 auto;
}
#menu3 ul {
width: 25%;
float: left;
margin: 0;
padding: 0;
text-align: left;
background: #000 url(../images/bg/menu.gif) repeat-x top left;
}
#menu3 ul li {
display: inline;
margin: 0;
padding: 0;
list-style: none;
}
#menu3 ul li a {
float: left;
width: 100%;
height: 4.5em;
font: 400 1.2em arial, sans-serif;
letter-spacing: 0.1em;
color: #fff;
border-top: 7px solid #DBEAEA;
border-bottom: 15px solid #FFF;
}
#menu3 ul li a span {
display: block;
padding: 2px 7px;
}
#menu3 ul li a span.desc {
font-size: 0.8em;
color: #8C8D94;
}
#menu3 ul li a:hover,
#menu3 ul li a.here {
background: #CCCCCC;
border-top: 7px solid #006699;
}
#menu3 ul li a:hover span.desc,
#menu3 ul li a.here span.desc {
color: #FFF;
}
/**************************************************************
Top Block Menu 4
**************************************************************/
#menu4 {
margin: 0 auto;
}
#menu4 ul {
width: 25%;
float: left;
margin: 0;
padding: 0;
text-align: left;
background: #000 url(../images/bg/menu.gif) repeat-x top left;
}
#menu4 ul li {
display: inline;
margin: 0;
padding: 0;
list-style: none;
}
#menu4 ul li a {
float: left;
width: 100%;
height: 4.5em;
font: 400 1.2em arial, sans-serif;
letter-spacing: 0.1em;
color: #fff;
border-top: 7px solid #DBEAEA;
border-bottom: 15px solid #FFF;
}
#menu4 ul li a span {
display: block;
padding: 2px 7px;
}
#menu4 ul li a span.desc {
font-size: 0.8em;
color: #8C8D94;
}
#menu4 ul li a:hover,
#menu4 ul li a.here {
background: #CCCCCC;
border-top: 7px solid #FFFFFF;
}
#menu4 ul li a:hover span.desc,
#menu4 ul li a.here span.desc {
color: #FFF;
Discussão (7)
Carregando comentários...