altezza di un div che contiene 2 div float:left

[giorginooo]

ciao a tutti, sto lavorando con XHTML su FireFox.
Ho un div al cui interno sono posizionati altri due div.
Io voglio che i due div interni siano disposti orizzontalmente e non uno sotto l'altro.
A tale scopo ho settato la proprietà CSS float:left per entrambi i div interni.
A questo punto è nato il mio problema:
Sembrerebbe che i due div interni "escano" dal div esterno ed in particolare che l'altezza del div esterno non cresca abbastanza in modo da contenere i due div interni.
Questa è parte del codice:
<div class="outerbox">
<div class="insidebox1">
1
</div>
<div class="insidebox2">
...div content..
</div>
</div>

Il primo div interno deve contenere un solo numero, mentre il secondo div interno può contenere testo immagini, ecc.. e non posso sapere in anticipo quanto diventi alto.
(non posso utilizzare altre strategie quali position:relative o cose del genere in quanto ho dei problemi nell'applicazione in cui sto lavorando)
Anche usando queste disposizioni di stile
.outerbox{
min-height: 20px;
height: auto;
}
.insidebox1{
float:left;
}

.insidebox2{
float:left /*oppure right*/;
}

l'altezza dell'outerbox non cresce al crescere dell'altezza di insidebox2.
Qualcuno potrebbe spiegarmi per quale motivo?
grazie

 

[dead]

devi dare la direttiva float:left anche all'outerbox.
i div flottanti infatti non seguono il flusso, e riconoscono come elemento contenitore solo un altro elemento fuori flusso (float o absolute)

 

[giorginooo]

purtroppo se utilizzo la direttiva float:left anche per il box esterno è vero che l'altezza si setta automaticamente, ma ora anche questo box esce da quello che lo contiene. infatti c'è un altro div in cui sono stati inseriti quelli che ho descritto (e un altro ancora). Non posso settare su tutti la proprietà float:left.

 

[dead]

Allora mi sa che è la struttura che va rivista.
Il concetto del float (che vuol dire "galleggiare") è proprio che il box galleggia verso DX o SX.
Non so cosa vuoi ottenere esattamente, ma probabilmente c'è una maniera più corretta.

In alternativa puoi provare a dare display:block al contenitore, e poi position:relative ai div interni, ma mi sa che vai a crearti ancora più problemi...

 

[giorginooo]

purtroppo non posso dare position:relative ai div interni perchè ho problemi. Quello che voglio è disporre orizzontalmente i due div all'interno del div "outerbox". Quindi voglio che "insidebox1" e "insidebox2" siano uno affianco all'atro e non uno sotto l'altro.
E' per questo che ho utilizzato float:left per i div interni.
C'è un'altra soluzione per ottenere un orientamento orizzontale per il contenuto del div esterno?

 

[dead]

c'è l'attributo display:inline da dare ai div interni (senza float in questo caso).
Attenzione però che inline funziona se gli elementi in esso contenuti non sono block.
quindi non potrai mettere all'interno ul, br, ecc.

 

[sbobby]

Dla mio umile punto di vista direi che dovresti inserire all'interno del dive che contiene i due div, uno con float: left e l'altro con float: right, un footer con scritto:

p.footer {clear: both;
margin-top: 0px;
margin-bottom: 0px;

Sul mio sito funziona: io ho un div contenito molto grande con all'interno due div: uno a sinistra con float: left che contiene il menu e uno a destra con float:right che contiene la bacheca: ho inserito in fondo al div contenitore tale footer e tutto è disposto correttamente: prova!!!