ciao, premetto che dopo una ricerca nel forum e nei link utili non ho ancora capito come risolvere il problema. ho un layout con tre colonne. La prima di sfondo verde, la seconda con sfondo bianco e la terza con sfondo rosso. La colonna centrale è quella che contiene i contenuti, le due laterali hanno solo un colore di sfondo per creare l'effetto bandiera italiana. Il problema si presenta quando il contenuto centrale va oltre l'altezza massima della finestra del browser perchè nelle due colonne laterali lo sfondo rimane fermo a dov'era l'altezza della finestra del browser e non segue l'altezza della colonna al centro.
codice html:
<div id="container">
<div id="sidebar1"></div>
<div id="sidebar2"></div>
<div id="centro"> parte con i contenuti</div>
</div>
codice css:
body {
margin:0;
padding:0;
height:100%;
}
#container {
height:100%;
}
#centro {
top:0;
margin: 0 25% 0 25%;
min-height:100%;
background:rgb(0,0,0);
}
#sidebar1 {
float: left;
width: 25%;
height:100%;
background:rgb(9,138,48);
}
#sidebar2 {
float: right;
width: 25%;
background:rgb(228,0,27);
height:100%;
}
Rispondi quotando
