[css] forzare l'altezza di un box.

[hotel_vv]

ciao a tutti.

ho un box con dentro altri due box. i box interni hanno entrambi float left, il box contenitore ha uno sfondo e altezza 100%.

con mozilla come faccio che questo box contenitore sia piu' grande dei due box interni e non si afflosci dietro?

#content{ /*box contenitore*/
	position: relative;
	background: #D9D9F6;
	text-align: left;
	height: 100%;
	padding: 50px 5px;
	margin: 0px;
}

#text { /*box sinistro*/
	float: left;
	background: #990000 url(images/redtab.gif) no-repeat left top;
	width: 450px;
	padding: 10px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 430px;
}

.rightbox { /*box destro*/
	width: 260px;
	float: left;
	padding: 10px;
	background: #6666CC;
	margin: 0px 0px 10px 30px;
	text-align: left;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 240px;
}

[webcreators]

Se non ricordo male basta impostare min-height,cioè un attributo che explorer non riesce a vedere, ma permette di dire al browser la height minima del documento.. Mozilla leggendo height dentro i tuoi css assegna al contenitore una misura fissa, mentre assegnandogli min-height sarà possibile dargli una misura minima oltre la quale il browser dovrebbe continuare ad allungare la cella in questione.Per fare ciò sarà necessario usare questo codice:

#content {
min-height: 200px;
height: auto !important;
height: 200px;
}

[hotel_vv]

si ma se height e' 100% come fa a essere una misura fissa?! :master:

[webcreators]

Ah già, non ci avevo fatto caso.. allora devo chiederti che doctype stai usando.. nell'html4 l'uso della percentuale in height non è proprio accettato.. per riparare metti questo nel codice nei css

html, body {height: 100%;}

[hotel_vv]

sono in xhtml strict....

grazie del body height: 100%... non lo sapevo proprio!

[webcreators]

Originariamente inviato da hotel_vv
sono in xhtml strict....

grazie del body height: 100%... non lo sapevo proprio!

Di nulla io ho avuto il tuo stesso problema due giorni fà

Bye

[hotel_vv]

scusa... l'ultima cosa....

anche a te il box contenitore viene molto piu' alto usando height: 100%; nel body e nell'html?

[webcreators]

Originariamente inviato da hotel_vv
scusa... l'ultima cosa....

anche a te il box contenitore viene molto piu' alto usando height: 100%; nel body e nell'html?

Che intendi ? se supera lo spazio della pagina del browser facendo cosi' apparire le scrollbar ? si, certo.

E' normale, perchè tu gli dai il 100%, quindi lui prende come punto di riferimento la grandezza che esiste tra la parte più alta del browser e quella più bassa.. non tenendo conto del fatto che la pagina possa contenere altri elementi che occupano lo spazio..

Insomma se stai usando una risoluzione 800x600 lui si allungherà per i 450px (ad es.) che caratterizzano la height della pagina del browser, indipendentemente dagli elementi che vi sono sopra..

Bye

[deleted_id_48586]

Originariamente inviato da WebCreators
Se non ricordo male basta impostare min-height,cioè un attributo che explorer non riesce a vedere, ma permette di dire al browser la height minima del documento.. Mozilla leggendo height dentro i tuoi css assegna al contenitore una misura fissa, mentre assegnandogli min-height sarà possibile dargli una misura minima oltre la quale il browser dovrebbe continuare ad allungare la cella in questione.Per fare ciò sarà necessario usare questo codice:

#content {
min-height: 200px;
height: auto !important;
height: 200px;
}

confermo, vi è anche un articolo a riguardo su www.constile.org

[hotel_vv]

Originariamente inviato da Sgurbat
confermo, vi è anche un articolo a riguardo su www.constile.org

ok ma l'altezza di quel box deve variare con l'altezza del box contenitore (che li dipende da quanto testo a dentro)

ma perche' mi viene fuori cosi' con mozilla!!??!