Strano comprtamento di DIV

[Emulman]

Ciao a tutti!

ho un bel problema che mi fa impazzire...ho una pagina XHTML 1.1 divisa in 5 DIV verticali affiancati così fatta:

<div class="erba"></div>
<div class="cordolo"></div>
<div id="asfalto">
  [img]images/logos/logo.gif[/img]

</div>
<div class="cordolo"></div>
<div class="erba"></div>

e un file css a parte che descrive i DIV così

#asfalto {
  float: left;
  top: 0px;
  background-image: url(../images/site/asfalto.jpg);
  background-repeat: repeat;
  min-height: 100%;
  font-family: Verdana, Arial, Helvetica;
  color: #CCCCCC;
  text-align: center;
}
.erba {
  float: left;
  top: 0px;
  background-image: url(../images/site/erba.jpg);
  background-repeat: repeat;
  min-height: 100%;
}

.cordolo {
  float: left;
  top: 0px;
  background-image: url(../images/site/cordolo.jpg);
  background-repeat: repeat;
  width: 1%;
  min-height: 100%;
}

il problema è che in Firefox-Chrome-Safari mi appare solo il DIV centrale "asfalto" tutto spostato a sinistra, solo con Opera si vede correttamente!!! la develoepr bar di firefox mi visualizza tutit e 5 i div...soluzione????

[Emulman]

ho trovato subito la risposta al problema! ho letto su un sito che dopo ogni MIN-HEIGHT: 100% bisogna usare un HEIGHT: 100% mettendolo risolvo il problema! SCUSATE IL DISTURBO...

[Vincent.Zeno]

Originariamente inviato da Emulman
ho trovato subito la risposta al problema! ho letto su un sito che dopo ogni MIN-HEIGHT: 100% bisogna usare un HEIGHT: 100% mettendolo risolvo il problema! SCUSATE IL DISTURBO...

nessun distubo,anzi...

ma dovresti chiarire una cosa:
l'esempio corretto sarebbe questo?

.erba {
 float: left;
 top: 0px;
 min-height: 100%;
 height: 100%;
}

[Emulman]

si proprio quello..mettendo così visualizzo correttamente tutti e 5 i DIV