trois divs à l'intérieur d'un conteneur div - comment faire pour que la hauteur soit automatique?

Question

J'ai un div parent, avec trois divs l'intérieur pour créer un effet de colonne:

#container { 
    height:230px; 
    float:left; 
} 
#container_colone { 
    float:left; 
    width:40%; 
    height:auto; 
} 
#container_coltwo { 
    float:left; 
    width:40%; 
    height:auto; 
} 
#container_colthree { 
    float:right; 
    width:40%; 
    height:auto; 
} 

avec html ici

<div id="container"> 
    <div id="container_colone"> 
    col one here 
    </div> 
    <div id="container_coltwo"> 
    col two here 
    </div> 
    <div id="container_colthree"> 
    col three here 
    </div> 
</div> 

Depuis que je suis en train de la hauteur dans le récipient, je veux tous les colonnes dans ce conteneur pour avoir la même hauteur. Donc, si je place le conteneur div à 400000000px, les trois colonnes auront la même hauteur.

Le code ci-dessus ne le coupe pas, et j'ai besoin d'aide pour comprendre ce que je dois faire pour que je puisse l'obtenir rapidement dans le futur.

Toute aide serait grandement appréciée!

Answer 1

Modifier le CSS comme:

#container { 
    height:230px; 
    float:left; 
    } 
    #container_colone { 
    float:left; 
    width:30%; 
    height:100%; 
    } 
    #container_coltwo { 
    float:left; 
    width:30%; 
    height:100%; 
    } 
    #container_colthree { 
    float:right; 
    width:30%; 
    height:100%; 
    } 

Answer 2

40% + 40% + 40% = 120% - cela ne vous donnera jamais trois colonnes.

height:auto - l'élément est dimensionné à la hauteur de son contenu

height:100% - l'élément est dimensionné à la hauteur de celui-ci CONTAINER, donc l'utiliser.

Essayez-: http://jsfiddle.net/BYaGD/