Estou desenvolvendo um projeto, finalizei a estrutura e fui para os testes. O Código abaixo funciona no IE 7.0, Firefox 2.0 / 1.5, Opera 9.0 / 9.2.
Está com problemas no IE 6.0 =/
Já tentei mudar de tudo, o problema está na div Login, fica um espaço em branco embaixo do menu.
Alguém pode me ajudar ?
<body><div id="geral"> <div id="topo"></div> <div id="menu"><ul> <li><a href="#" class="selecionado" title="Esta é a Página Inicial"> Home </a></li> <li><a href="#" title="Veja sobre nossa Empresa"> A Empresa </a></li> <li><a href="#" title="Para saber quais no..."> Serviços </a></li> <li><a href="#" title="Nossos Projetos"> Projetos </a></li> <li><a href="#" title="Confira a variedade"> Equipamentos </a></li> <li><a href="#" title="Faça seu orçamento"> Orçamento </a></li> <li><a href="#" title="Venha nos visitar"> Fale Conosco </a></li> </ul> </div> <div id="login"></div> <div id="conteudo"> <div id="box1"><h1 class="h1"><img src="imgs/xxx.jpg" title="Lançamentos" alt="Título Lançamentos" /></h1></div> <div id="box2"><h1 class="h1"><img src="imgs/box2_promocoes.jpg" title="Promoções" alt="Título Promoções" /></h1></div> <div id="box3"><h1 class="h1"><img src="imgs/box3_servicos.jpg" title="Serviços" alt="Título Serviços" /></h1> <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla consequat sollicitudin elit. Nunc sagittis aliquet magna. Sed ante sem, commodo.</p> <h2 class="h2"><a href="#">+ Saiba mais</a></h2> </div> <div id="box4"><h1 class="h1"><img src="imgs/box4_fornecedores.jpg" title="Fornecedores" alt="Título Fornecedores" /></h1><!--[if !IE]> --><object type="application/x-shockwave-flash" data="fornecedores.swf" width="128" height="61"><!-- <![endif]--><!--[if IE]><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" width="128" height="61"> <param name="movie" value="fornecedores.swf" /><!--><!----> <param name="loop" value="true" /> <param name="menu" value="false" /> <p>Esse é o conteúdo alternativo</p></object></div> <div id="box5"><h1 class="h1"><img src="imgs/box5_eventos.jpg" title="Eventos" alt="Título Eventos" /></h1> <p><strong>30/11/2007</strong> - XXXXXXXXXX</p> <p><strong>30/12/2007</strong> - XXXXXXXXXX</p> <p><strong>30/01/2008</strong> - XXXXXXXXXX</p> <h2 class="h2"><a href="#">+ Saiba mais</a></h2> </div> </div> <div id="rodape"></div> </div></body>
E abaixo o CSS:
/* FOLHA DE ESTILO PARA SITE XXXXX */* { margin: 0; padding: 0; } body,div,td,h1,h2,h2,h4,form,input{font:11px Georgia,Arial,Verdana;color:#808285;}a{text-decoration:none;color:#EA1D22;}p{text-decoration:none; text-align:center;}body { background:url(imgs/bg.jpg); margin:0; padding:0; text-align:center; text-decoration:none; }#geral { background:#FFF; width:768px; text-align:center; margin:0 auto; } /* ####### TOPO ######## */#topo { background: url(imgs/topo.jpg); width:768px; height:142px; margin:0px; }/* ####### MENU ######## */ #menu { background: url(imgs/bg_menu.jpg) repeat-x; height:38px; font-family:Verdana, Arial, Helvetica, sans-serif; } #menu .selecionado { background:url(imgs/bg_menu2.jpg) repeat-x; color:#FFF; text-decoration:underline; height:38px;} #menu ul { margin:0px; padding:0px; float: none; list-style:none; margin-left:50px;}#menu ul li { display:inline;} #menu ul li a{ padding: 10px 13px; float:left; text-decoration: none; color: #fff; font-family:Verdana, Arial, Helvetica, sans-serif; font-weight:bold; } #menu ul li a:hover { background:url(imgs/bg_menu2.jpg) repeat-x; color:#FFF; text-decoration:underline; height:38px; }/* ####### login ######## */ #login { height:20px; background:url(imgs/bg_login.jpg); margin:0px; padding:0px; }/* ##################################################### CONTEÚDO ########################################### */#conteudo { background:#FFF; height:319px; }/* ##################################################### BOX 1 ########################################### */ #box1 { background:#fff; width:396px; height:148px; float:left; margin:15px 0px 0px 15px;}#box1 .h1 { font-family: Georgia,Verdana,Arial, serif; font-size:14px; font-weight:bold; color:#939598; margin:0px; text-align:left;}#box1 .h2 { font-family: Georgia,Verdana,Arial, serif; font-size:12px; font-weight:bold; color:#FFCC00; margin-right:10px; float:right;}#box1 .h2 a:link { font-size:12px; color:#FFCC00; font-family: Georgia,Verdana,Arial, serif; } #box1 .h2 a:hover { font-size:12px; color:#FFF; background-color:#006633; font-family: Georgia,Verdana,Arial, serif; }#box1 p { font-family: Verdana,Verdana,Arial, serif; font-size:11px; margin-left:78px; margin-right:10px; color:#fff; margin-top:5px; text-align:left;} /* ##################################################### BOX 2 ########################################### */ #box2 { background:#fff; width:272px; height:148px; float:right; margin:15px 15px 0px 0px;} #box2 .h1 { font-family: Georgia,Verdana,Arial, serif; font-size:18px; font-weight:bold; color:#FFCC00; margin:0px; text-align:left;}#box2 .h2 { font-family: Georgia,Verdana,Arial, serif; font-size:12px; font-weight:bold; color:#FFCC00; margin-left:10px; float:left;}#box2 .h2 a:link { font-size:12px; color:#FFCC00; font-family: Georgia,Verdana,Arial, serif; } #box2 .h2 a:hover { font-size:12px; color:#FFF; background-color:#006633; font-family: Georgia,Verdana,Arial, serif; }#box2 p { font-family: Verdana,Verdana,Arial, serif; font-size:11px; margin-left:10px; margin-right:110px; margin-bottom:25px; color:#fff; margin-top:5px; text-align:left;}/* ##################################################### BOX 3 ########################################### */#box3 { background:#fff; width:257px; height:110px; float:left; margin:15px 15px 0px 15px;}#box3 .h1 { font-family: Georgia,Verdana,Arial, serif; font-size:18px; font-weight:bold; color:#FFCC00; margin:0px; text-align:center;}#box3 .h2 { font-family: Verdana,Georgia,Arial, serif; font-size:10px; font-weight:bold; color:#EA1D22; margin-right:20px; float:right;}#box3 .h2 a:link { font-size:10px; color:#EA1D22; font-family: Verdana,Georgia,Arial, serif; } #box3 .h2 a:hover { font-size:10px; color:#FFFFFF; background-color:#EA1D22; font-family: Verdana,Georgia,Arial, serif; }#box3 p { font-family: Verdana,Verdana,Arial, serif; font-size:10px; margin-left:10px; margin-right:10px; margin-bottom:15px; color:#b2b3b6; margin-top:5px; text-align:left;}/* ##################################################### BOX 4 ########################################### */ #box4 { background:#fff; width:150px; height:110px; float:left; margin:15px 15px 0px 0px;}#box4 .h1 { font-family: Georgia,Verdana,Arial, serif; font-size:18px; font-weight:bold; color:#FFCC00; margin:0px; text-align:center;}#box4 .h2 { font-family: Georgia,Verdana,Arial, serif; font-size:12px; font-weight:bold; color:#FFCC00; margin-left:55px; float:left;}#box4 .h2 a:link { font-size:12px; color:#FFCC00; font-family: Georgia,Verdana,Arial, serif; } #box4 .h2 a:hover { font-size:12px; color:#FFF; background-color:#006633; font-family: Georgia,Verdana,Arial, serif; }#box4 p { font-family: Verdana,Verdana,Arial, serif; font-size:11px; margin-left:58px; margin-right:10px; margin-bottom:25px; color:#fff; margin-top:5px; text-align:left;}/* ##################################################### BOX 5 ########################################### */ #box5 { background:#fff; width:272px; height:110px; float:right; margin:15px 23px 0px 0px;}#box5 .h1 { font-family: Georgia,Verdana,Arial, serif; font-size:18px; font-weight:bold; color:#FFCC00; margin:0px; text-align:center;}#box5 .h2 { font-family: Verdana,Georgia,Arial, serif; font-size:10px; font-weight:bold; color:#EA1D22; margin-right:20px; float:right;}#box5 .h2 a:link { font-size:10px; color:#EA1D22; font-family: Verdana,Georgia,Arial, serif; } #box5 .h2 a:hover { font-size:10px; color:#FFFFFF; background-color:#EA1D22; font-family: Verdana,Georgia,Arial, serif; }#box5 p { font-family: Verdana,Verdana,Arial, serif; font-size:11px; margin-left:20px; margin-right:10px; margin-bottom:7px; color:#b2b3b6; margin-top:5px; text-align:left;} /* ####### RODAPÉ ######## */ #rodape { background: url(imgs/rodape.jpg); height:121px;}#rodape .h1 { font-family: Verdana, Arial, Georgia, sans-serif; color:#fff; font-size:10px; font-weight:bold; float:left; margin:8px 0px 0px 8px; }#rodape .h2 { font-family: Verdana, Arial, Georgia, sans-serif; color:#fff; font-size:10px; font-weight:bold; float:right; text-decoration: none; margin:8px 8px 0px 0px; }/* ### ESTILOS PARA LINKS ### */#cont1 { width:600px; height:300px; float:right; background: #fff; margin:5px 0px 0px 5px; padding:5px 5px 0px 5px; }#cont1 .h1 { font-family: georgia, verdana, times new roman, arial; color: #bb2929; font-size:18px; font-weight:bold; text-align:justify; padding:8px 0px; margin:0px;} #cont1 .h2 { font-family: georgia, verdana, times new roman, arial; color: #EA1D22; font-size:14px; font-weight:bold; text-align:justify; padding:0px 0px; }#cont1 p { text-align:justify; padding:10px 0px 0px 0px;}#cont1 .h3 { font-size:10px; color:#EA1D22; font-family: Verdana,Georgia,Arial, serif; text-align:right; }#cont1 .h3 a:link { font-size:10px; color:#EA1D22; font-family: Verdana,Georgia,Arial, serif; } #cont1 .h3 a:hover { font-size:10px; color:#FFFFFF; background-color:#EA1D22; font-family: Verdana,Georgia,Arial, serif; } /* cont1 h4 */#cont1 .h4 { font-size:10px; color:#EA1D22; font-family: Verdana,Georgia,Arial, serif; text-align:center; margin-top:5px; }#cont1 .h4 a:link { font-size:10px; color:#EA1D22; font-family: Verdana,Georgia,Arial, serif; } #cont1 .h4 a:hover { font-size:10px; color:#FFFFFF; background-color:#EA1D22; font-family: Verdana,Georgia,Arial, serif; } /* continução cont */#cont1 ul { font-family: georgia, verdana, times new roman, arial; font-size:11px; text-align: justify; margin-left:0px; margin-top:10px;}/* ####### CONTEUDO 2 ######## */#cont2 { width:130px; height:289px; float:left; margin-top:5px; background-image:url(imgs/bg_submenus.jpg); margin:10px 10px 0px 2px;}#cont2 .h2 { font-family: georgia, verdana, times new roman, arial; color: #FFCC00; font-size:14px; font-weight:bold; font-family: georgia, verdana, times new roman, arial; text-align:justify; padding:0px 0px;}ul.menu_vertical { margin: 0; padding: 0; list-style: none; margin-top:55px;}ul.menu_vertical li a{ display: block; padding: 3px; font-family: georgia, verdana, times new roman, arial; font-size:11px; color: #fff; border-bottom: 1px solid #fff; text-decoration: none;}ul.menu_vertical li a:hover { background: #399497;}/* ####### TITLE ######## */ div#qTip { padding: 3px; border: 1px solid #FFF; border-right-width: 2px; border-bottom-width: 2px; display: none; background: #bb2929; color: #FFF; font: bold 9px Verdana, Arial, Helvetica, sans-serif; text-align: left; position: absolute; z-index: 1000;}
Edição feita por: § Kenshin §, 04/12/2007, 12:05.
para codigos grandes use a tag [codebox]!
