chantas
Power Member
Boas malta.
Tou com um pequeno problema a nivel de compatibillidade CSS em Firefox e Ie7.
Imagem do IE7:
Imagem do Firefox:
Como podem vêr está ali um espaço no firefox depois do menu que não devia existir....podem ajudar-me a analisar o código para detectar o problema?
Aqui vai o HTML:
E o respectivo CSS:
Fico a aguardar algum feedback da vossa parte
Cumps. e obrigado.
Tou com um pequeno problema a nivel de compatibillidade CSS em Firefox e Ie7.
Imagem do IE7:
Imagem do Firefox:
Como podem vêr está ali um espaço no firefox depois do menu que não devia existir....podem ajudar-me a analisar o código para detectar o problema?
Aqui vai o HTML:
Código:
<body>
<div id="wrapper">
<div id="header" class="largura">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="899" height="114">
<param name="movie" value="images/banner.swf" />
<param name="quality" value="high" />
<embed src="images/banner.swf" width="899" height="114" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash"></embed>
</object>
<div id="menu">
<ul>
<li><a href="http://www.dynamicdrive.com/"style="border-left: 1px solid #DADADA;">Quem Somos</a></li>
<li><a href="http://www.dynamicdrive.com/style/">Galeria de Imagens</a></li>
<li><a href="http://www.cssdrive.com/">Contactos</a></li>
</ul>
</div>
</div>
<div id="corpo">
<div id="left">
</div>
<div id="right">
<h5>dfgdfgdfgdfgdfgdfgdfg</h5>
</div>
</div>
<div id="footer"></div>
</div>
</body>
E o respectivo CSS:
Código:
/* CSS Document */
body {
background:url(images/fundo.png) repeat-x;
margin:0px;
padding:0px;
}
#wrapper {
position:absolute;
left: 50%;
width: 899px;
margin-left: -449.5px;
}
#header {
background:#FFFFFF;
height:auto;
}
#menu{
font-weight: bold;
font-size: 90%;
}
#menu:after{ /*Add margin between menu and rest of content in Firefox*/
display: block;
height: 0;
visibility: hidden;
}
#menu ul{
border: 1px solid #DADADA;
width: auto;
background:url(images/menu.png) repeat-x;
padding: 5px 0;
margin: 0;
text-align: center; /*set value to "right" for example to align menu to the left of page*/
}
#menu ul li{
display:inline;
}
#menu ul li a{
color: #494949;
padding: 5px;
margin:0;
text-decoration: none;
border-right: 1px solid #DADADA;
}
#menu ul li a:hover{
background: url(images/hover.png) center center repeat-x;
}
#corpo {
background:#ffffff url(images/corpo.png) repeat-x;
height:450px;
}
#left {
background:url(images/imagem5.jpg) no-repeat 50% 50%;
width:262px;
height:392px;
float:left;
}
#right {
width:637px;
height:392px;
font-family:Verdana, Arial, Helvetica, sans-serif;
}
#footer {
background:url(images/menu.png) repeat-x;
height:29px;
clear:both;
}
Fico a aguardar algum feedback da vossa parte
Cumps. e obrigado.