28220 sujets
Bonjour,
C'est un sujet assez tortueux, à la fois parce que la théorie est complexe (notions de caneva, de viewport, de conteneur initial) et parce que les implémentations sont fréquement buguées.
A titre d'exemple, voici la conclusion que Paul-Peter Koch a tiré d'une série de test sur le sujet, et qui est à la fois très judicieuse et très révélatrice :
( http://www.quirksmode.org/viewport/experiments.html )
Ces éléments html et body ne jouent pas le même rôle dans CSS selon que l'on est dans :
- un document HTML ou XHTML1.0 traité comme du HTML (text/html, le cas le plus courant actuellement) : les deux éléments ont un rôle particulier.
- un document XHTML traité en tant que XML (application/xhtml+xml) : l'élément body n'a plus de rôle particulier (c'est un simple div, comme dit Anne Van Kesteren), et c'est l'élément html qui doit assumer seul les fonctions correspondantes.
En outre, dans les deux cas, il faut distinguer :
- les propriétés CSS qui s'appliquent aux éléments html et body comme s'il s'agissait de n'importe quel élément de niveau bloc. Les règles d'héritage vont en particulier jouer de la même manière. Exemple : font-family, font-size, color appliquées à html ou à body vont être indifféremment héritées par le reste de la structure. On ne rencontrera pas de problèmes, mais on ne gagnera rien non plus à styler html plutôt que body...
- certaines propriétés qui devraient être dans le cas précédent, mais où des navigateurs vont avoir des implémentations défectueuses quand il s'agit de l'élément html. Exemple: certains cas de bordures dans IE Windows.
- les propriétés qui doivent s'appliquer selon des règles propres aux éléments html ou body : background-color, background-image, overflow... Ces règles diffèrent selon que l'on est en text/html ou en application/xhtml+xml. Elles sont surtout diversement interprétées ou respectées selon les navigateurs, et particulièrement par IE Windows.
Au bout du compte, concrètement :
- quand il s'agit de HTML ou d'XHTML traité comme du HTML, il n'y a guère d'intérêt à styler l'élément html, mis à part le plaisir de faire compliqué quand on peut faire simple. Certes, cela permet de forcer certains comportements (simuler la position fixe dans IE Windows, figer la hauteur de la page, etc), mais ceux-ci sont problématiques par ailleurs (ergonomie, accessibilité, bugs)
- En revanche, c'est à la fois nécessaire et utile en XHTML traité comme tel. La mise hors-jeu d'IE Windows (qui ne peut pas traiter ce type de document) simplifie alors beaucoup les choses...
Modifié par Laurent Denis (18 Dec 2005 - 09:09)
C'est un sujet assez tortueux, à la fois parce que la théorie est complexe (notions de caneva, de viewport, de conteneur initial) et parce que les implémentations sont fréquement buguées.
A titre d'exemple, voici la conclusion que Paul-Peter Koch a tiré d'une série de test sur le sujet, et qui est à la fois très judicieuse et très révélatrice :
a écrit :
Quand Microsoft a ajouté le mode de rendu Strict à Internet Explorer Windows, il a apparemment inséré un nouvel élément de niveau block entre le body et le reste de la page. Ce nouveau bloc est devenu le body, et son parent (l'ancien body) est devenu l'élément html. [Le nouveau body] a cependant conservé plusieurs de ses propriétés et de ses comportements antérieurs
( http://www.quirksmode.org/viewport/experiments.html )
Ces éléments html et body ne jouent pas le même rôle dans CSS selon que l'on est dans :
- un document HTML ou XHTML1.0 traité comme du HTML (text/html, le cas le plus courant actuellement) : les deux éléments ont un rôle particulier.
- un document XHTML traité en tant que XML (application/xhtml+xml) : l'élément body n'a plus de rôle particulier (c'est un simple div, comme dit Anne Van Kesteren), et c'est l'élément html qui doit assumer seul les fonctions correspondantes.
En outre, dans les deux cas, il faut distinguer :
- les propriétés CSS qui s'appliquent aux éléments html et body comme s'il s'agissait de n'importe quel élément de niveau bloc. Les règles d'héritage vont en particulier jouer de la même manière. Exemple : font-family, font-size, color appliquées à html ou à body vont être indifféremment héritées par le reste de la structure. On ne rencontrera pas de problèmes, mais on ne gagnera rien non plus à styler html plutôt que body...
- certaines propriétés qui devraient être dans le cas précédent, mais où des navigateurs vont avoir des implémentations défectueuses quand il s'agit de l'élément html. Exemple: certains cas de bordures dans IE Windows.
- les propriétés qui doivent s'appliquer selon des règles propres aux éléments html ou body : background-color, background-image, overflow... Ces règles diffèrent selon que l'on est en text/html ou en application/xhtml+xml. Elles sont surtout diversement interprétées ou respectées selon les navigateurs, et particulièrement par IE Windows.
Au bout du compte, concrètement :
- quand il s'agit de HTML ou d'XHTML traité comme du HTML, il n'y a guère d'intérêt à styler l'élément html, mis à part le plaisir de faire compliqué quand on peut faire simple. Certes, cela permet de forcer certains comportements (simuler la position fixe dans IE Windows, figer la hauteur de la page, etc), mais ceux-ci sont problématiques par ailleurs (ergonomie, accessibilité, bugs)
- En revanche, c'est à la fois nécessaire et utile en XHTML traité comme tel. La mise hors-jeu d'IE Windows (qui ne peut pas traiter ce type de document) simplifie alors beaucoup les choses...
Modifié par Laurent Denis (18 Dec 2005 - 09:09)
.