La théorie des floats
Les éléments flottants ou floats font partie des outils de positionnement les plus utilisés en CSS et pourtant ils sont souvent une source de tracas majeur pour les développeurs web.
Le problème du float est celui de la plupart des autres propriétés de positionnement qui « sortent de l’ordinaire », c’est-à-dire qui ne correspondent pas au positionnement par défaut. Parce qu’il applique de nouvelles règles de positionnement, un élément flottant ne peut pas être manipulé de la même façon qu’un positionnement normal si l’on souhaite avoir le résultat désiré.
En clair, vous ne pouvez pas exiger d’une cafetière qu’elle vous fasse un café si vous mettez des feuilles de thé dans le filtre sous prétexte que, ben, cette technique a toujours bien marché dans la théière. Pour que la propriété float fonctionne correctement, il faut l’utiliser avec les bons éléments.