Esse é o site: http://www.buthy.com.br/fisk
A intenção é deixar a logomarca em cima da imagem grande...
Isso está acontecendo no Chrome, mas no IE e no Firefox a imagem fica para baixo, e não em baixo.
Segue algumas screens:
Como deve ficar (Chrome):
Como fica no IE e no Firefox:
CSS:
<style type="text/css">
@font-face {
font-family: 'delta';
src: url('fonts/delta.eot');
src: url('fonts/delta.eot?#iefix') format('eot'),
url('fonts/delta.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
html, body {
height:100%;
}
body {
background-color:#d5d5d5;
font-family:"delta";
background:url('images/background.png') no-repeat center top;
color:#818181;
}
*html #base { height:100%; }
#base {
position:relative;
min-height:100%;
}
#base2 {
min-height:100%;
padding-bottom:285px;
}
#linha_cabecalho {
width:100%;
height:3px;
background-color:#cf2026;
}
#linha_rodape {
width:100%;
height:3px;
background-color:#10437a;
}
#cabecalho {
width:1000px;
height:130px;
margin:0 auto;
}
#menu-esq {
width:378px;
float:left;
background-color:#0C0;
height:130px;
}
#logo {
width:243px;
height:160px;
position:relative;
z-index:999;
float:left;
}
#menu-dir {
width:378px;
float:left;
background-color:#099;
height:130px;
}
#conteudo-topo {
width:1000px;
height:5px;
margin:0 auto;
margin-top:-20px;
background:url('images/bg-conteudo-topo.png') no-repeat center;
}
#conteudo {
width:1000px;
margin:0 auto;
background:url('images/bg-conteudo-meio.png') repeat-y center;
min-height:500px;
}
#conteudo-rodape {
width:1240px;
height:45px;
margin:0 auto;
background:url('images/bg-conteudo-rodape.png') no-repeat center;
}
#slider {
width:990px;
height:227px;
margin:0 auto;
z-index:-999;
}
#slider img, #sobre, #novidades, #cursos {
-moz-border-radius: 3px; /* Para Firefox */
-webkit-border-radius: 3px; /*Para Safari e Chrome */
border-radius: 3px; /* Para Opera 10.5+*/
}
#sobre {
margin:5px 0 0 5px;
width:340px;
height:300px;
background:url('images/bg-sobre-a-fisk.png') no-repeat;
overflow:hidden;
}
#base-rodape{
width:100%;
height:290px;
position:absolute;
bottom:0;
}
#rodape{
width:1000px;
margin:0 auto;
padding-top:15px;
color:#fff;
}
#rodape a:visited, #rodape a:link, #rodape a:active, #rodape a:hover {
color:#818181;
text-decoration:none;
font-weight:600;
font-size:13px;
}
#contador {
background:url('images/ico-visitantes.png') no-repeat left;
padding-left:25px;
height:16px;
padding-top:8px;
}
.delta {
font-size:12px;
font-weight:bold;
font-style:normal;
color:#818181;
}
.separador-rodape {
width:14px;
height:263px;
float:left;
margin-right:12px;
background:url('images/separador-rodape.png') no-repeat center top;
}
.rodape-item {
background:url('images/marcador-rodape.png') no-repeat left;
padding-left:10px;
margin-bottom:4px;
}
h1 {
font-weight:400;
font-size:13px;
font-style:normal;
color:#cf2026;
padding:0 0 7px 0;
}
h2 {
font-weight:400;
font-size:13px;
font-style:normal;
color:#10437a;
padding:0 0 7px 0;
}
</style>Se alguém puder me ajudar a solucionar isso, agradeço!
Já postei em mais dois fóruns (imasters e scriptbrasil) e nenhum solucionou ainda...
Obrigado
Até mais!
Edição feita por: Buthy, 07/02/2012, 19:01.
