En CSS, le overflow:hidden
est défini sur les conteneurs parents afin de lui permettre de s'étendre avec la hauteur de leurs enfants flottants.
Mais il a aussi une autre caractéristique intéressante lorsqu'il est combiné avec margin: auto
...
Si le frère PREVIOUS est un élément flottant, il apparaîtra en fait juxtaposé à celui-ci. Autrement dit, si le frère est float:left
alors le conteneur avec float:none overflow:hidden
apparaîtra à droite du frère, pas de nouvelle ligne - comme s'il flottait dans le flux normal. Si le frère précédent est float:right
alors le conteneur apparaîtra à gauche du frère. Le redimensionnement de ce conteneur l'affichera avec précision centré entre les éléments flottants. Disons que si vous avez deux frères et sœurs précédents, l'un float:left
l'autre float:right
, le conteneur apparaîtra centré entre les deux.
Alors, voici le problème ...
Comment conserver ce type de mise en page SANS masquer les enfants?
Googler partout sur le Web me donne des moyens de clear:both
développer et d'agrandir un conteneur ... mais je ne trouve pas de solution alternative pour maintenir le centrage gauche / droite de l'enfant précédent. Si vous créez le conteneur, overflow:visible
le conteneur ignore soudainement le flux de disposition des éléments flottants et apparaît en couches au-dessus de l'élément flottant.
Alors question :
Je dois avoir le conteneur overflow:hidden
pour conserver la mise en page ...
comment faire pour que les enfants ne soient pas masqués? J'ai besoin d'avoir l'enfant positionné de manière absolue par rapport au parent en dehors du conteneur.
OU
Comment est-ce overflow:visible
que je peux absolument positionner un enfant par rapport au parent en dehors du conteneur ... ENCORE conserver le frère float-like-layout-flow?