[CSS] 3 Div che fanno i capricci
Sto rovinosamente perdendo la pazienza con 3 div che mi stanno facendo dannare...
Un div che fa da contenitore ha al suo interno 2 div che rispettivamente servono per:
il primo che non fa altro che creare un'effetto ombra sul div principale e l'altro che contiene il testo vero e proprio...
Il div contenitore non deve avere dimensione oltre a wight e deve estendersi in altezza fino alla fine del div del testo... Di conseguenza il div ombra deve arrivare alla fine del div contenitore ripetendo l'immagine che ha in background...
Il problema sta che il div ombra è visibile (o comunque ha un valore di height > 0) solo se definisco l'height al div contenitore (quindi forzando una dimensione), mentre dovrebbe comunque avere height > 0 in relazione alla dimensione che il div del testo fa assumere al div contenitore...
Al div ombra ho provato a definire l'height con auto e 100% ma appunto funzionano solo se il div contenitore ha height specificata e non in conseguenza al div testo...
Idee?
EDIT:
Codice:
Html:
<div id="middle">
<div id="middle_side_left"></div>
<div id="middle_page">
a<br />a
</div>
</div>
Css:
div#middle {
background: url(../gfx/background_middle.png);
/*height: 500px;*/
}
div#middle_side_left {
position: relative;
top: 0px;
left: 0px;
background: url(../gfx/middle_side_left.png) repeat-y;
width: 14px;
height: 100%;
display: inline;
float: left;
}
Così forse capite meglio... :lol:
