Altezza div 100%

[starcraftworld]

Ho un problema a settare l'altezza a 100% di un div!
Come posso fare?
Ecco il codice del CSS.

body {
    background:black;
    margin-top:0;
    margin-bottom:0;
    margin-left:0;
    margin-right:0;
    width: 100%;
    height: 100%;
}

div#navigation {
    width:50px;
    height:100%;
    border:solid 1pt #808080;
}

Questo è il div HTML.

        <div id="navigation">
        </div>

[fcaldera]

dovresti dare height: 100% anche all'elemento html.

[starcraftworld]

E se volessi creare un terzo div che occupi il restante della pagina?

[fcaldera]

Originariamente inviato da starcraftworld
E se volessi creare un terzo div che occupi il restante della pagina?

e cosa sarebbe il "restante" se hai già un div al 100%? :master:

[starcraftworld]

adesso ho una colonna a sinistra e l'header. come faccio a creare la colonna di destra che corrisponde al restante della pagina?

[Emulman]

io ho risolto il problema così:

l'importante è che il tag BODY abbia HEIGHT=100% come hai messo tu, e mettendo ora HEIGHT: 100% a un DIV questo rimepirà l'altezza del suo contenitore, cioè appunto il tag body. ma non basta:devi aggiungere margini del container e la POSITION del div. In altre parole:

body {
  height: 90%;
  background-image: url(../commons/images/site/grass.jpg);
  background-repeat: repeat;
  margin-left: 0px;
  margin-top: 0px;
  margin: auto;
}

div.main {
  position: absolute;
  left: 5%;
  width: 90%;
  height: 100%;
  background-image: url(images/site/cordolo.jpg);
} 

come vedi nel DIV.MAIN ho messo position: absolute e LEFT: 5%. Poichè io volevo dare al DIV una larghezza del 90% perfettamente centrato nella finestra del browser la parte sinistra del div dovrà essere a 5% dal bordo sinistro, calcolato dal MARGIN-LEFT del body.
la HEIGHT: 100% del DIV rimepirà totalmente l'aletzza del container BODY settato a 100%.

[starcraftworld]

quello sono riuscito a farlo. adesso dovrei creare il div in basso a destra, quello grande.

[Emulman]

se ho ben capito hai un div a sinistra e un div in alto come header; il terzo deve riempire il resto della pagina no?

in tal caso allora se ad esempio il div di sinistra è largo il 10% della fienstra e si trova a 5% dal bordo devi mettere qualcosa tipo

.content {
position: absolute;
left: 20%;
color:#333;
background:#ffc;
border:1px solid #333;
padding:0 10px;
height: 100%;
} 

il left sarebbe la somma di 5%+10%+5% (lo spazion fra il div di sinistra e il nuovo

allo stesso modo se vuoi mettere un footer in fondo alla pagina evita il height: 100% nel div di sinistra e nel content ma mettilo nel footer.