Lorsque Webkit (Safari, Chrome) rencontre une ligne-bloc où ...Webkit ignore vertical-aligner pour inline-blocs contenant des boîtes de ligne-
- la hauteur
line-height
est spécifiée - le contenu est rendu utilisation de plusieurs boîtes de ligne
... l'élément de bloc inline ignore le vertical-align
spécifié.
Pour illustrer le problème, j'ai un test simple: http://arther.net/lab/webkit-vertical-align-test.html#test
Firefox 3.6, Opera 10.53 et IE7 + traiter ces inline-blocs comme des éléments en ligne et alignement vertical fonctionne comme prévu. Les navigateurs Webkit (et Opera 10.10) traitent les blocs inline dans cette situation comme des éléments de niveau bloc, ignorant ainsi vertical-align
. Alors, qui a raison, et qui est bogué?
Je peux voir cela dans les deux sens. D'une part, vous pouvez dire que tous les éléments en ligne - même les blocs en ligne - doivent se positionner correctement dans la boîte de ligne contenant selon vertical-align
. D'un autre côté, les éléments en ligne définissent généralement une seule boîte en ligne et ne possèdent pas de boîtes de ligne. Tout ce qui entoure plusieurs lignes de ligne doit être un élément de niveau bloc. Dans ce cas, le bloc inline doit être traité comme un bloc, qui ignorera donc vertical-align
.
Compte tenu du comportement actuel, je figure que l'une des conditions suivantes est remplie:
- c'est un bug Webkit
- ce bogue dans tous les autres moteurs de rendu
- la spécification est vague au sujet gérer cette situation particulière, et différentes approches sont prises
Si quelqu'un pouvait fournir des éclaircissements sur la question et quel devrait être le comportement attendu, je voudrais grea Je ne l'apprécie pas.
Dans IE8, il y a un autre bug sur ceci: Il n'emballe pas le contenu, donc la ligne longue saigne vers la droite. – awe
C'est une sacrée honte que cette question n'ait pas reçu plus d'attention, c'est un problème avec lequel je me bats aussi. –