Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Oi, tenho 2 backgrounds numa página... gostaria que toda vez que a div das backgrounds aumentar, as imagens fossem esticadas conforme a div e diminuídas conforme o conteúdo fosse pouco també..
Estou utilizando assim:
<div id="container">
<img src="images/bg-unico_01.jpg" id="bg1" />
<img src="images/bg-unico_02.jpg" id="bg2" />
</div>o css:
div#container {
width:1040px; /*height:745px;*/ height:100%; border:solid 1px orange;
}
#bg1 {
position:absolute; top:0; left:0; z-index:0; width:100%; height:100%;
background-repeat:no-repeat; background-position:top;
}
#bg2 {
position:absolute; top:100%; left:0; z-index:0; width:100%; height:100%;
background-repeat:no-repeat; background-position:bottom;
}Só que a background não fica com height:100%; pra sempre... eu fiz um teste com um menú... add uns 30 ítens e a página não correu para baixo... =/
Eu só queria que esta background dupla ampliasse e diminuísse sempre que tivesse quantidades de conteúdo diferentes...
Bom, desta forma, apareceu um scroll para este container,
/applications/core/interface/imageproxy/imageproxy.php?img=http://i40.servimg.com/u/f40/11/80/81/44/relati10.jpg&key=c18d67bb52d1165805f604bfe4ce2590841f5606c5fe5e340935da7064d21acd" alt="relati10.jpg" />
onde só desapareceu se eu setar:
div#container {
width: 1040px;
border: solid 1px orange;
position:absolute;
}/applications/core/interface/imageproxy/imageproxy.php?img=http://i40.servimg.com/u/f40/11/80/81/44/absolu10.jpg&key=8cf0dc8a1d9dc3211a04bce01f8cc747dacdf619d590c948121b1bd49063a933" alt="absolu10.jpg" />
Além do scroll, que tentei sumir com overflow:hidden e nao deu certo, existe alguma outra diferença?
Cara,
só com essas imagens eu não entendi o que quer fazer. Não entendi o porque de duas imagens.
:thumbsup: @thiagoretondar
O motivo é dividir pra carregar mais rápido na página.... só isso.... =p
Tente assim:
div#container {
Posta uma imagem do resultado final que você deseja... fica mais fácil de encontrar uma solução.
:thumbsup: @thiagoretondar