[Résolu] Clearfix efficace ?

Bonjour.

Je m’adresse aux spécialiste du clearfix…

Sur le site présenté ici http://www.alsacreations.com/outils/lire/1573-learnlayout.html par Alsacréations, il est proposé un clearfix basique :

.clearfix {
	overflow: auto;
	zoom: 1;
	}

J’utilise de puis des années un plus lourd (que je n’ai biensûr pas inventé) :

.ie6 .sc,
.ie7 .sc {
	height: 1%;
	}

.sc:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
	}

Pensez-vous que le premier peut remplacer avantageusement le second ?

Hello,

Le premier est suffisant pour 2 raisons :
1- overflow: auto suffit à créer un Contexte de Formatage Block (dont à contenir des flottants)
2- zoom:1 confère le Haslayout à IE6 (donc contient les flottants)

Par contre, la contrepartie est que s'il y a un élément dont les dimensions sont plus larges que le conteneur, des barres de scroll vont apparaître. Cela peut arriver dans des cas très précis, par exemple un tooltip (infobulle) qui pourrait dépasser du parent.

OK. Merci pour les détails, c’est bien ce que j’avais compris.

Par contre, ton dernier commentaire laisse supposer que la méthode que j’utilise jusqu’à présent serait plus fiable (je n’ai pas testé ton exemple avec ce clearfix). Si c’est bien le cas, je continuerai à utiliser le mien : son gain serait supérieur à son coût.

Derwoed a écrit :
Si c’est bien le cas, je continuerai à utiliser le mien : son gain serait supérieur à son coût.

C'est un peu plus compliqué que ça en fait.

À vrai dire, avoir un BFC a plusieurs avantages (voir l'article) :
1- contenir des flottants
2- ne pas s'écouler autour des flottants
3- ne pas subir la fusion de marges

overflow: auto (ou hidden) permet d'avoir les 3 avantages, tandis qu'un clearfix ne procure que le 1er avantage.

Bref, au final, le BFC me semble plus avantageux... sauf exceptions

(Les .mod de KNACSS sont en overflow: hidden par exemple http://knacss.com/knacss.html )

Raphael a écrit :

C'est un peu plus compliqué que ça en fait.

Effectivement, ce n’est pas si simple !

Du coup, pas de solution miracle. Je vais faire quelques tests et y réfléchir de mon côté, mais je crois que je vais opter pour l’overflow aussi… Pour les cas rares d’un enfant plus large que le conteneur je traiterais ça autrement…