Estou fazendo uma pagina, em que eu quero colocar uma imagem passando tipo um slideshow, e sobreposta a essa imagem, um quadro com um texto, no canto. Eu consegui definindo "position", só que se eu colocar como absolute, eu consigo colocar ela em qualquer lugar da página, pois a div passa a se "alinhar" tendo como base a página. Só que o layout fica centralizado, logo, quando o cara diminuir o tamanho da janela do navegador (ou usar em outra resolução) o quadro vai pro lugar errado. Se eu colocar position como relative, ele fica no lugar onde eu quero e acompanhando o layout, só que a imagem não fica embaixo dele de jeito nenhum. Abaixo segue o código simplificado:
<style>
body {margin:0; margin-top:30px; margin-bottom:20px; padding:0; text-align:center; background-color:#000000;}
#tudo {width: 720px; margin:0 auto; text-align:left;}
#conteudo {width:720px; height:666px; float:left; background-color:#FFFFFF;}
#quadro_imagem {width:510px; height:260px; padding-left:10px; padding-bottom:10px; margin-left:50px; float:left; background-color:#000000;}
#quadro_branco {position:relative; top:0px; left:10px; width:128px; padding-left:2px; height:250px; z-index:1; background-color:#FFFFFF;}
#imagem {width:500px; height:260px; float:left;}
</style>
</head>
<body>
<div id="tudo">
<div id="conteudo">
<div id="quadro_imagem">
<div id="quadro_branco"></div>
<div id="imagem"><img src="teste.jpg" /></div>
</div>
</div>
</div>
</body>Basicamente o que eu preciso é:
Se usar absolute, tenho que fazer a div "quadro_branco" se alinhar pela "quadro_imagem", aí dá certinho.
Se usar relative, tenho que fazer a div "imagem" ficar por baixo da div "quadro_branco".
E aí, alguém se habilita ??? rsss
Valew pessoal
Edição feita por: mi7chael, 02/08/2007, 19:36.
