div vuoto altezza 100%

**bruco66** · 31-03-2005, 16:35

Vorrei riuscire a trovare il modo di visualizzare un div vuoto con altezza pari al 100% della pagine (quindi indipendente dalla risoluzione dello schermo) che funzioni sia con IE che con FF.
Ho provato anche ad applicare il suggerimento di un precedente thread (html{height: 100%}) ma non ci sono riuscito...
:-/

**floyd46** · 31-03-2005, 16:50

non vorrei ricordare male, ma se in un elemento di blocco (div) non c'è rappresentazione (quindi vuoto) è come se nn esistesse nemmeno lo stesso box. L'ho letto in un libro di J. Zeldman. In effetti ho fatto la prova e dichiarando un'altezza pari al 100% non viene visualizzato nella pagina il contenitore con l'altezza specificata.
saluti

**bruco66** · 31-03-2005, 20:27

Eppure in Firefox è semplice; con IE invece lavorare in percentuale diventa una bestia nera... ma è strano che nessuno si sia docuto cimentare...

**rudyF** · 31-03-2005, 21:40

Se gli dai un colore di fondo (style="background-color:red") il DIV rimane vuoto, però c'è!
Non so come si fa a dare le misure in percentuale.
ciao rudyF

**bruco66** · 01-04-2005, 08:30

Bene, vedo che qualcun altro che è andato per tentativi c'è. Ma *nessuno* che sia arrivato alla soluzione giusta valida sia per FF che per IE?

**Saturno83** · 01-04-2005, 09:19

codice:

<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" style="height:100%;">
<head>
<title>Documento senza titolo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style>
.prova {
	display:block;
	background:#000080;
	width:100px;
	min-height:100%;
	height: auto !important; 
	height: 100%;
}
</style>

</head>

<body style="height:100%; margin:0px;">

<div class="prova">
prvoa

</div>


</body>
</html>

Prova questo

**bruco66** · 01-04-2005, 13:48

grazie! provo e ti faccio sapere.

**bruco66** · 04-04-2005, 11:11

Purtroppo ho ancora un problema.
La tua soluzione funziona perfettamente nel caso del div più esterno, ma non in quello di div annidati (vedi codice [minimale] di esempio allegato). IE è ok, ma FF non rispetta le altezze % assegnate. Come mai?
In effetti io avrei bisogno del classico layout
container
- header
- content
- footer
applicando l'altezza 100% al content, e purtroppo il tuo codice non funziona... :-/

<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" style="height:100%;">
<head>
<title>Documento senza titolo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style>
.prova {
display:block;
border: solid 1px;
min-height:100%;
height: auto !important;
height: 100%;
}
</style>

</head>

<body style="height:100%;">

<div class="prova">
prova

<div class="prova"">
ancora prova

</div>

</div>

**Dave-Z** · 04-04-2005, 11:43

http://forum.html.it/forum/showthrea...hreadid=809208

Discussione: div vuoto altezza 100%

Strumenti discussione

Ricerca discussione

Visualizza

div vuoto altezza 100%

Re: div vuoto altezza 100%

Permessi di invio