Float: left break container div?

Question

Ho una casella modale in cui sto cercando di mettere due colonne una accanto all'altra, e l'ho fatto assegnando float: sinistra a un div (.center-columnb) ea un float: a destra per la colonna .map. Ciò che succede, tuttavia è che 'center-columnb' spezza il contenitore div con lo sfondo grigio sfumato come se questo div fosse posizionato SOTTO quel contenitore div (notare i bordi arrotondati sul fondo della parte grigia, che doveva essere a il fondo del div. Quando rimuovo float: a sinistra da centercolumnb da style.css, tutto è ok tranne che la colonna a destra non rimane più lì Qualcuno ha alternative che potrebbero aiutarmi? Grazie :)

Answer 1

Hai una divisione genitore di #contentholder ma non contiene i float al suo interno. Un elemento flottato, per impostazione predefinita, viene rimosso dal flusso del documento e qualsiasi div principale verrà compresso. Per fare in modo che contenga i float all'interno, devi dargli una proprietà di overflow. Questo dovrebbe fare il trucco:

#contentholder { 
    overflow: auto; 
} 

Answer 2

Un altro modo è cancellare nella parte inferiore del contenitore Domanda. Per una soluzione completa compatibile con browser, è sufficiente aggiungere prima del div di chiusura:

<div style="clear:both"></div>