Problèmes de floats résolus
Faire en sorte que le parent prenne la hauteur de l'enfant même si ce dernier est float: left
Si vous faites du développement web, de l'intégration et de la mise en page à l'aide de CSS, vous avez sans doute déjà vécu ce problème : Comment faire en sorte que l'élément parent d'un div float: left prenne la hauteur de son enfant le plus grand?
Réponse
Jusqu'à maintenant, j'utilisais une balise br sur laquelle j'assignais un style clear: both. Ça fonctionnait, mais le br n'était pas très sémantiquement le bienvenue... La meilleure façon de le faire est donc de donner au parent un style overflow: auto;
Exemples
Sans overflow sur le parent
Avec overflow sur le parent
<style type="text/css" media="screen" id="test"> #a{ background-color: red; overflow: auto; } #test{ width: 400px; background-color: blue; height: 200px; float: left; } #test2{ width: 200px; background-color: green; height: 100px; float: left; } </style>
