Alexandro Zaleski 0 Denunciar post Postado Janeiro 17, 2011 Bom dia Pessoal.. eu to com um problemão.. já procurei, reprocurei.. achei algumas coisas, no firefox funcionou.. no IE8 também, mas no IE7 e o IE6 não funcionou.. O negócio é o seguinte: eu preciso criar um banner que fique centralizado e as laterais aumentem e diminuam conforme a resolução do monitor. Depois de pesquisar eu achei um script que funcionou, criei 3 divs e alterei elas com CSS. Funcionou perfeito nos navegadores que citei acima e não funcionou nos demais. Não sei o que fazer. Já usei o Z-index, e um monte de outras coisas. vou postar o código e o link para que vocês deem uma olhada.se olhar no firefox e no IE6 verão a diferença. Arquivo HTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <title></title> <link href="../css/estilo.css" type="text/css" rel="stylesheet" /> </head> <body> <div id="corpo"> <div id="banner_direita"></div> <div id="banner_esquerda"></div> <div id="banner_centro"></div> </div> </body> </html> Arquivo CSS * { margin: 0px; padding: 0px; } body { font-family: Verdana; font-size: 12px; color: #000000; } #corpo { margin: auto; margin-bottom: 5px; width: 100%; height: auto; } #corpo #banner_centro { margin: auto; width: 900px; height: 180px; background-image: url("../img/banner_centro.jpg"); position: relative; } #corpo #banner_esquerda { float: left; width: 49%; height: 180px; background-image: url("../img/banner_esquerda.jpg"); background-repeat: repeat-x; } #corpo #banner_direita { float: right; width: 49%; height: 180px; background-image: url("../img/banner_direita.jpg"); background-repeat: repeat-x; } E o Link Para que vocês possam ver funcionando. www.portalsinos.com.br Se alguém tiver uma solução.. agradeço.. Obrigado Compartilhar este post Link para o post Compartilhar em outros sites
Evandro Oliveira 331 Denunciar post Postado Janeiro 17, 2011 #banner_esquerda, #banner_direita { background: repeat-x; height: 180px; left: 0; position: absolute; right: 0; top: 0; z-index: -1; } #banner_esquerda { right: 50%; } #banner_direita { left: 50%; } Compartilhar este post Link para o post Compartilhar em outros sites
Alexandro Zaleski 0 Denunciar post Postado Janeiro 17, 2011 Olá Evandro Oliveira.. Eu testei o que você me passou, mas não funcionou, nem no firefox funcionou.. Não sei o que fazer, pois testei de tudo e não consigo fazer funcionar.. teria mais alguma idéia? Obrigado Compartilhar este post Link para o post Compartilhar em outros sites
William Bruno 1501 Denunciar post Postado Janeiro 17, 2011 Eu pessoalmente, faria uma unica imagem bem larga. ai definiria como background, e colocaria o background-position como: center top; e pronto, resolvido. Compartilhar este post Link para o post Compartilhar em outros sites
Alexandro Zaleski 0 Denunciar post Postado Janeiro 17, 2011 William Bruno.. É uma boa idéia mesmo.. vnão tinha pensado nisso.. vou fazer uns testes e qualquer coisa volto a postar aqui.. obrigado William Bruno.. Deu certo a tua opção.. Muito obrigado pela ajuda.. Compartilhar este post Link para o post Compartilhar em outros sites
