Div fluttandi

[Werwolfe]

ragazzi ho tre colonne e ho l'esigenza che entrambe si allungano anche se il testo di una delle colonne è minore rispetto all'altro, ho fatto il css così ma nulla:

#banner {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 839px;
	margin-bottom: 0;
	width: 164px;
	background-image: url(../index/sfondo_banner.png);
}
#pagine {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 839px;
	margin-bottom: 0;
	width: 606px;
}
#spazio_sx {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 839px;
	margin-bottom: 0;
	width: 230px;
	background-image: url(../index/sfondo_banner.png);
}

Appena tolgo l'altezza non mantengono più la stessa altezza come posso risolvere?

[Werwolfe]

Ho praticamente risolto in parte mettendo nel main la classe che contiene la struttura questo codice :

 #main {
	margin: 0 auto;
	width: 1000px;
	background-image: url(../index/sfondo_banner.png);
	overflow:auto;
}

il problema rimane che per le tre colonne : Banner , spazio_sx e pagine, anche se tolgo l'altezza la pagina non scende ma anzi si accorcia non mostrando più quello che sta scritto, purtroppo è una pagina dinamica e si riempirà di contenuto e ho bisogno che scenda

@charset "utf-8";

body {
	background-color: #fff;
	font-size: 62.5%;
	margin: 0;
	padding: 0;
	background-image: url(../index/sfondo.png);
}
body * {
	font-size: 100%;
}
h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
}
p {
	margin-bottom: 1.1em;
	margin-top: 0;
}
#main p.lastNode {
	margin-bottom: 0;
}
a:link img, a:visited img {
	border: none;
}
div.clearFloat {
	clear: both;
	font-size: 0;
	height: 0;
	line-height: 0px;
}
li.clearFloat {
	clear: both;
}
ul.symbolList {
	display: inline;
	float: left;
	list-style-type: none;
	margin: 0;
	padding: 0;
}
.AbsWrap {
	position: relative;
	width: 100%;
}
.rowWrap {
	width: 100%;
}
#main {
	margin: 0 auto;
	width: 1000px;
	background-image: url(../index/sfondo_banner.png);
	overflow:auto;
}
#home {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 149px;
	margin-bottom: 0;
	width: 151px;
}



#biblioteca {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 149px;
	margin-bottom: 0;
	width: 150px;
}
#regolamento {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 149px;
	margin-bottom: 0;
	width: 142px;
}
#galleria {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 149px;
	margin-bottom: 0;
	width: 143px;
}
#scafalli {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 149px;
	margin-bottom: 0;
	width: 143px;
}
#donazioni {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 149px;
	margin-bottom: 0;
	width: 147px;
}
#contatti {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 149px;
	margin-bottom: 0;
	width: 124px;
}
#logo {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 174px;
	margin-bottom: 0;
	width: 1000px;
}
#slide {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 432px;
	margin-bottom: 0;
	width: 1000px;
	background-image: url(../index/index_r3_c1.png);
}
#banner {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	margin-bottom: 0;
	width: 164px;
	background-image: url(../index/sfondo_banner.png);
}
#pagine {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	margin-bottom: 0;
	width: 606px;
	background-image: url(../index/sfondo_banner.png);
}
#spazio_sx {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 839px;
	margin-bottom: 0;
	width: 230px;
	background-image: url(../index/sfondo_banner.png);
}
#index_r5_c1 {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 72px;
	margin-bottom: 0;
	width: 1000px;
}

Questo è il foglio di style

[Werwolfe]

Ho praticamente risolto in parte mettendo nel main la classe che contiene la struttura questo codice :

 #main {
	margin: 0 auto;
	width: 1000px;
	background-image: url(../index/sfondo_banner.png);
	overflow:auto;
}

il problema rimane che per le tre colonne : Banner , spazio_sx e pagine, anche se tolgo l'altezza la pagina non scende ma anzi si accorcia non mostrando più quello che sta scritto, purtroppo è una pagina dinamica e si riempirà di contenuto e ho bisogno che scenda

@charset "utf-8";

body {
	background-color: #fff;
	font-size: 62.5%;
	margin: 0;
	padding: 0;
	background-image: url(../index/sfondo.png);
}
body * {
	font-size: 100%;
}
h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
}
p {
	margin-bottom: 1.1em;
	margin-top: 0;
}
#main p.lastNode {
	margin-bottom: 0;
}
a:link img, a:visited img {
	border: none;
}
div.clearFloat {
	clear: both;
	font-size: 0;
	height: 0;
	line-height: 0px;
}
li.clearFloat {
	clear: both;
}
ul.symbolList {
	display: inline;
	float: left;
	list-style-type: none;
	margin: 0;
	padding: 0;
}
.AbsWrap {
	position: relative;
	width: 100%;
}
.rowWrap {
	width: 100%;
}
#main {
	margin: 0 auto;
	width: 1000px;
	background-image: url(../index/sfondo_banner.png);
	overflow:auto;
}
#home {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 149px;
	margin-bottom: 0;
	width: 151px;
}



#biblioteca {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 149px;
	margin-bottom: 0;
	width: 150px;
}
#regolamento {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 149px;
	margin-bottom: 0;
	width: 142px;
}
#galleria {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 149px;
	margin-bottom: 0;
	width: 143px;
}
#scafalli {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 149px;
	margin-bottom: 0;
	width: 143px;
}
#donazioni {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 149px;
	margin-bottom: 0;
	width: 147px;
}
#contatti {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 149px;
	margin-bottom: 0;
	width: 124px;
}
#logo {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 174px;
	margin-bottom: 0;
	width: 1000px;
}
#slide {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 432px;
	margin-bottom: 0;
	width: 1000px;
	background-image: url(../index/index_r3_c1.png);
}
#banner {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	margin-bottom: 0;
	width: 164px;
	background-image: url(../index/sfondo_banner.png);
}
#pagine {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	margin-bottom: 0;
	width: 606px;
	background-image: url(../index/sfondo_banner.png);
}
#spazio_sx {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 839px;
	margin-bottom: 0;
	width: 230px;
	background-image: url(../index/sfondo_banner.png);
}
#index_r5_c1 {
	margin-left: 0px;
	margin-top: 0px;
	display: inline;
	float: left;
	height: 72px;
	margin-bottom: 0;
	width: 1000px;
}

Questo è il foglio di style

[ratte]

Ciao Werwolfe. prova ad organizzare il tuo layout in modo che funzioni con questa base:

<div style="dispaly:table-row;">
<div style="display:table-cell;">bla bla bla</div>
<div style="display:table-cell;">bla bla bla</div>
<div style="display:table-cell;">bla bla bla</div>
</div>

...dovrebbe andà... 8)

o/ !

[Werwolfe]

grazie prov subito