Comment obtenir un Div conteneur avec automatique de la Hauteur et avec des divs flottantes à l'intérieur?
J'ai le code HTML suivant
<style type="text/css">
<!--
.msg_ok{
font-family: "Trebuchet MS";
font-weight: bold;
font-size: 16px;
margin:0 auto;
padding:10px;
width:500px;
height:auto;
display:block;
}
.msg_ok{
background-color:#DCFFB9;
border:#003300 1px solid;
color:#003500;
}
-->
</style>
<div class="msg_ok" style="height:auto;">
<div style="display:block;float:left;width:350px; height:auto;">
<p>line 1<br>
line2<br>
line3<br>
line4<br>
line5<br>
</p>
</div>
<div style="display:block;float:left;width:100px; height:auto;">
<a href="#">Print</a>
</div>
</div>
Et j'obtiens ce résultat
cependant comment je peux obtenir un résultat comme celui-ci, le div conteneur avec une auto de hauteur, qui fit sa taille avec les divs flottantes à l'intérieur?
Merci d'avance
OriginalL'auteur Max | 2012-03-06
Vous devez vous connecter pour publier un commentaire.
ajouter ces
et supprimer
height:auto
, c'est inutile puisque la taille est toujours auto (par défaut). le problème que vous rencontrez est comment contenir des flotteursOriginalL'auteur Joseph
Je pense que vous êtes à la recherche pour le clair-fix "hack", pour éviter le parent de perdre de la hauteur, quand il contient des éléments flottants, droit?
Ajouter un
<div class="clear"> </div>
après la dernière div flottante, et ensuite utiliser le code CSS suivant:OriginalL'auteur Christofer Eliasson
Vous avez besoin d'ajouter un élément après les éléments flottants qui nettoiera les flotteurs. Général:
OriginalL'auteur aaroncatlin
Essayer cette
Jsfiddle hauteur automatique
Font écran à la propriété "inline-block" pour msg_ok classe
OriginalL'auteur me_digvijay
Meilleure méthode est d'utiliser clearfix. Consultez ce lien - http://css-tricks.com/snippets/css/clear-fix/
OriginalL'auteur Praveen Vijayan