Doctype et CSS

J'ai le code suivant avec doctype transitionnel mais quand je le mets à strict alors la position des images change et se déplace vers le haut. Pourriez-vous s'il vous plaît m'aider à comprendre le problème sous-jacent et où je peux trouver la liste de ce type d'autres conflits CSS entre différents doctypes.Doctype et CSS

S'il vous plaît noter que je sais que peu de balises HTML ne sont pas disponibles en mode strict, mais je suis spécifique sur les conflits CSS.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
<body> 
<style type="text/css"> 
span.check:before { content: url("http://i41.tinypic.com/2rxea7d.png"); } 
</style> 
<table> 
<tr> 
<th>Ruby on Rails</th> 
    <td><span class="check"></span></td> 
    <td><span class="check"></span></td> 
    <td><span class="check"></span></td> 
    <td><span class="check"></span></td> 
</tr> 
<tr> 
<th>Road on Rails</th> 
    <td><span class="check"></span></td> 
    <td><span class="check"></span></td> 
    <td><span class="check"></span></td> 
    <td><span class="check"></span></td> 
</tr> 
</table> 
</body> 
</html>

Source

2012-01-30 Shawn Taylor

Dans quels navigateurs? – vvondra

Dans FX 9.0.1 et le dernier Chrome, mais pas sûr des autres. –

Lire: http://www.quirksmode.org/css/quirksmode.html – zvona

En mode quirks et mode presque standard les images (qui sont contenus en ligne, sont donc disposés sur le même ensemble de lignes comme polices de caractères) sont zero-height positioned at their baseline.

Vous pouvez obtenir le même effet en mode Standards en modifiant la propriété vertical-align des images générées ou en les définissant comme display: block.

Source

2012-01-30 12:59:14 Quentin

J'ai mis display: bloquer ; ci-dessous le contenu correct mais il n'a rien changé et la différence entre les deux types de doctypes reste intacte. –

Je m'attends à ce que changer votre doctype change le mode que certaines versions d'Internet Explorer fonctionnent du mode standard au mode de compatibilité. Internet Explorer (entre autres choses) a corrigé comment il interprète le modèle de boîte de bordure, mais a été capable de basculer entre l'ancienne méthode et la méthode corrigée en fonction du DOCTYPE.

Source

2012-01-30 13:01:29

Doctype et CSS

Répondre

Questions connexes