Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Pessoal, estou tendo sérios problemas em tornar um código aqui compatível com o IE6
Esse site aqui:
http://br.geocities.com/the_pretzels88/gloss/
fica exatamente do jeito que eu quero no firefox, mas no IE6 desfaz tudo..
estou usando css e Library no site
O Azul é HTML e o Verde é o CSS
<body>
<div id="geral"><!-- #BeginLibraryItem "/Library/layout.lbi" -->
<link href="css/default.css" rel="stylesheet" type="text/css" media="all" />
<!-- MENU -->
<div class="pro_line2">
<ul class="select">
<li><a href="#nogo"><b>HOME</b></a></li>
<li><a href="#nogo"><b>A EMPRESA</b></a></li>
<li><a href="#nogo"><b>PRODUTOS</b><!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul class="sub">
<li><a href="#nogo"><strong>EMPRESARIAL</strong></a></li>
<li><a href="#nogo"><strong>SERVIÇO</strong></a></li>
<li><a href="#nogo"><strong>CASUAL</strong></a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a href="#nogo"><b>CLIENTES</b></a></li>
<li><a href="#nogo"><b>CONTATO</b></a></li>
</ul>
</div>
<!--FIM DO MENU -->
-
<div id="logo">
<div><img src="images/back1.jpg" width="772" height="71" /></div>
<div><img src="images/back2.jpg" /></div>
<div><img src="images/back3.jpg" /></div>
<div><img src="images/back4.jpg" /></div>
<div><img src="images/back5.jpg" /></div>
<div><img src="images/back6.jpg" /></div>
<div id="meio">
<div><img src="images/back7.jpg" /></div>
<div><img src="images/back8.jpg" /></div>
</div>
<div><img src="images/back9.jpg" /></div>
</div>
<!-- #EndLibraryItem --></div>
</body>
-----------------------------------------------------------
/MENU/
.pro_line2 {
font-family: Arial, Helvetica, verdana, sans-serif;
position:absolute;
left:199px;
top:128px;
width:559px;
height:88px;
font-size:15px;
z-index:5;
}
.pro_line2 .select {
margin:0;
padding:0 0 0 0px;
list-style:none;
white-space:nowrap;
}
.pro_line2 li {
float:left;
background:#FF0000; /red/
}
.pro_line2 .select a {
display:inline;
height:31px;
float:left;
background:#00FF00; /green/
padding:0 0px 0px 0px;
text-decoration:none;
line-height:31px;
white-space:nowrap;
color:#4661a8; /cor da letra/
}
.pro_line2 .select a b {
display:block;
padding:0px 19px 0px 19px;
background:#FFFFFF; /white/
}
.pro_line2 .select a:hover,
.pro_line2 .select li:hover a {
background:#FFFF00; /yellow/
padding:0 0 0 0px;
line-height:31px;
cursor:pointer;
color:#fff; /cor do texto "hover"/
}
.pro_line2 .select a:hover b,
.pro_line2 .select li:hover a b {
display:block;
padding:0px 19px 0px 19px;
background:#e4e3e3 right top; /cinza/
cursor:pointer;
}
.pro_line2 .sub {
display:none;
}
/ IE6 only /
.pro_line2 table {
border-collapse:collapse;
margin:0px;
font-size:1px;
width:0px;
height:0px;
}
.pro_line2 .sub {
margin:2px;
padding:2px 0px 0px 0px;
margin-left:70px;
list-style:none;
font-family: Arial, Helvetica, verdana, sans-serif;
}
.pro_line2 .sub li {
height:70px;
background:none;
}
.pro_line2 .select :hover .sub {
display:block;
position:absolute;
float:left;
width:400px;
top:28px;
left:4px;
text-align:center;
}
.pro_line2 .select :hover .sub li a
{display:block;height:16px; line-height:16px; float:left; background:none; padding:0 20px; margin:0px; white-space:nowrap; border:1px solid; border-left-color:#FFFFFF; border-bottom:hidden; border-right-color:#FFFFFF; border-top:hidden; color:#FFF; font-size:12px;}
.pro_line2 .select :hover .sub li a:hover
{color:#9F9F9F; background:#FFFFFF; line-height:15px;}
/FIM DO MENU/
O menu original é deste site: http://www.cssplay.co.uk/menus/pro_dropline2-5.html
Nele mesmo já tem uns trambiques pra funcionar no IE mas eu tinha que modificar um pouco e essas modificações não ficam iguais no IE6.
Se alguém puder me ajudar dizendo pelo menos algumas ideias eu agradeço desde já..
Inteh depois!
Carregando comentários...