HasLayout et bugs de rendu dans Internet Explorer 6-7 - Alsacréations. Le HasLayout, dont vous avez sans doute entendu parler au détour d'un tutoriel ou sur un forum, est une spécificité du navigateur Internet Explorer pour Windows, qui affecte les versions 5 à 7 incluses. Il s'agit d'un mécanisme interne du moteur de rendu d'Internet Explorer. Le HasLayout intervient dans le positionnement des éléments et plus généralement dans le calcul de l'affichage des pages web. Bref, c'est une question de cuisine interne. Pourquoi s'en occuper, s'il s'agit de cuisine interne ? Eh bien parce que cette cuisine-là n'est pas invisible, et que ses conséquences se font sentir dans nos pages web. En effet, ce mécanisme est lié à de nombreux bugs de rendu d'Internet Explorer. Concrètement, qu'est-ce-que c'est? Les explications détaillées sur le HasLayout peuvent être trouvées dans l'article On Having Layout. On retiendra surtout que, pour Internet Explorer, tout élément d'une page HTML peut avoir deux états: soit il a le layout, soit il ne l'a pas.
Mais qui a le layout? Une «classe conditionnelle» pour IE 6 et 7 - Alsacréations. Les cancres du Web, Internet Explorer 6, 7 et parfois 8, nous mènent souvent la vie dure. Même quand on s’abaisse à leur niveau, il leur arrive de ne pas comprendre, ou d’y mettre de la mauvaise volonté. La solution classique (comprendre: à l’ancienne) est d’utiliser des hacks CSS. Ces derniers sont déconseillés car peu fiables; en effet, on ne sait jamais à l’avance quels seront les navigateurs sur le marché dans deux ou cinq ans, et comment ils comprendront ou pas nos hacks CSS.
Une deuxième solution, conseillée par Microsoft et Alsacréations (que du beau monde :)), est d’utiliser les commentaires conditionnels. Nous allons voir dans cet article que l’utilisation habituelle des commentaires conditionnels a quelques inconvénients, et proposer une technique qui combine plusieurs avantages : les classes conditionnelles. Le problème des commentaires conditionnels Cependant, dans la pratique, une feuille de style corrective pour Internet Explorer ne suffira pas. Une alternative ? Mise en page CSS avancée grâce à la propriété display - Alsacréations. L'abandon par de plus en plus d'intégrateurs de l'utilisation de tableaux pour l'élaboration de mises en page a indiscutablement apporté de nombreux avantages, mais également son lot d'inconvénients. Parmi ceux-ci, un majeur: le centrage vertical simple et automatisé du contenu d'un objet. Les habitudes de plusieurs années de développement par tables ont laissé des traces, des habitudes ancrées de manière indélébile qui ne sont pas systématiquement préjudiciables; c'est entre autres le cas du recours à la propriété vertical-align.
Fort de ce constat, et vu la puissance qu'offre les cellules de tableaux en terme d'alignement vertical de leurs contenus, la spécification CSS admet logiquement l'attribution de ce comportement à tout élément qui en nécessiterait. Prenons un exemple simple de disposition d'un texte scindé en trois paragraphes que l'on souhaite agencer en drapeau: Logiquement, ma structure HTML sera des plus simplistes: ZONE CSS | Définition css expression (feuille de style css) et compatiblité navigateurs | expression et sa relation avec les balises. ZONE CSS | Questions réponses (Faq CSS) | Les css et leurs relations avec les balises HTML et XHTML.