Height 100% su div vuoto

**daviweb** · 29-10-2004, 14:31

Ciao, ho bisogno di avere un box alto 100%, ma con lo strict non funziona!!

Come si fa?

Grazie

codice:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="prova.css" rel="stylesheet" type="text/css">
</head>

<body>

<div id="box"></div>
	
</body>
</html>

codice:

body {
	padding:0px;
	margin:0px;
	height:100%;
}

#box {
	position:relative;
	width:100%;
	height:100%;
	background:#FFFF00;
}

**jesus** · 29-10-2004, 14:37

codice:

html {
  height: 100%;
}

**daviweb** · 29-10-2004, 14:55

Ok, così funziona! Grazie

Ma la cosa non è finita qui...

codice:

<div id="box">
	<div id="box_main">
		si vede solo questa riga
	</div>
</div>

codice:

html {
	height: 100%;
}
body {
	padding:0px;
	margin:0px;
	height:100%;
}
#box {
	position:relative;
	width:100%;
	min-height:100%;
	height:auto!important;
	height:100%;
	background:#CCCCCC;
}
#box_main {
	position:relative;
	margin:auto;
	width:778px;
	height:100%;
	background:#FF00FF;
}

Perchè anche il box interno non è alto 100%?

**zoom** · 29-10-2004, 15:50

prima cosa: evita gli _ nei nomi delle classi, danno qualche problema. usa i -

secondo: ma cos'è che vorresti ottenere? non capisco il senso di un box largo 100% se all'interno poi ne metti uno largo il classico 778px...

**daviweb** · 29-10-2004, 16:00

Perchè all'interno del box 100%, oltre a quello centrale 768, devo inserire anche due box in posizione assoluta.
E senza quel box mi davano grossi problemi se rimpicciolivo il browser...

Vi allego l'immagine del risultato che devo ottenere. Ovviamente dovrà essere del tutto ridimensionabile, fluido!

**zoom** · 29-10-2004, 16:06

prova così...

<div id="box">
si vede solo questa riga
</div>
<div class="absuno">
testo testo
</div>
<div class="absdue">
testo testo
</div>

html{
height: 100%;
}
body{
padding:0px;
margin:0px;
height:100%;
text-align:center;
}
#box{
width:778px;
min-height:100%;
height:auto!important;
height:100%;
margin:auto;
background:#FF00FF;
border:1px solid black;
text-align:left;
}
.absuno{
position:absolute;
left:0;
top:50px;
width:100%;
background-color:red;
text-align:left;
}
.absdue{
position:absolute;
left:0;
top:200px;
width:100%;
background-color:red;
text-align:left;
}

:master:

**daviweb** · 29-10-2004, 16:15

In quel modo quando ridimensioni (rimpicciolisci) il browser e poi vai a destra con la barra di scorrimento, le barre orizzontali risultano tagliate!

Non vorrei cantare vittoria, ma forse ho trovato. Ma siccome in questa situazione ogni volta che sistemo qualcosa se ne sballa un'altra, fate come se non avessi detto niente!!

**daviweb** · 29-10-2004, 18:06

Ce l'ho fatta davvero!!

Ho riprovato col metodo iniziale (quello suggerito da zoom), inserendo dentro i due div orizzontali un box dalle dimensioni fisse!

Poi c'era un altro problema che non avevo ancora esposto, e anche quello è risolto!!

Ora vado avanti ad aggiungere elementi alla pagina sperando vada tuto bene... :rollo:

Grazie a tutti!

ciao

**zoom** · 29-10-2004, 20:03

**daviweb** · 09-11-2004, 11:28

Originariamente inviato da zoom
prima cosa: evita gli _ nei nomi delle classi, danno qualche problema. usa i -

VVoVe: Hai ragione!!!

Discussione: Height 100% su div vuoto

Strumenti discussione

Ricerca discussione

Visualizza

Height 100% su div vuoto

Permessi di invio