5568 sujets

Sémantique web et HTML

Probleme de DTD sous firefox

Hello a tous,

jai un petit soucis de DTD sous firefox, jai un code relativement simple pour afficher des images les unes sous les autres. Elles doivent etre collées, or si je laisse la declaration de la DTD <!DOCTYPE ...>, sous firefox jai un blanc entre chaque ligne d'image alors que sous ie tout va bien. Si je retire <!DOCTYPE ...> les blancs disparaissent ! Ceci que ce soit en html ou xhtml.
Voici le code complet : 



<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr" xml:lang="fr">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=ISO-8859-1" />
<title>ALICE</title>
<style type="text/css">
body{background-color: #ffffff;margin:0px;padding: 0px;}
#contenu {text-align:center;}
img {border:0px;}
</style>
</head>
<body>
<div id="contenu">
	<a href="#"><img src="mailing_promo_1.jpg"  alt="" /><img src="mailing_promo_1_1.jpg"  alt="" /></a><br />
	<a href="#"><img src="mailing_promo_2.jpg"  alt="" /><img src="mailing_promo_3.jpg"  alt="" /></a><br />
	<a href="#"><img src="mailing_promo_4.jpg"  alt="" /><img src="mailing_promo_5.jpg"  alt="" /></a><br />
	<a href="#"><img src="mailing_promo_6.jpg"  alt="" /><img src="mailing_promo_7.gif"  alt="" /><img src="mailing_promo_8.jpg"  alt="" /></a>
</div>
</body>
</html>



Merci d'avance ! Smiley biggrin
Tu n'aurais pas une page ou ligne, ou au pire une capture d'écran ?
Impossible de constater le rendu obtenu sans avoir les images sous la main.

Sinon, les blancs entre les lignes d'images viennent sans doute du fait qu'une image est considérée comme un caractère, positionné verticalement sur la ligne de base (baseline) et non pas tout en bas de la ligne de texte.
Il semblerait qu'en mode de rendu « quircks », ça ne soit pas le cas.
Mais utiliser ce mode de rendu de manière volontaire est, très probablement, une fort mauvaise idée !

Sur le positionnement vertical des images sur une ligne de texte, il y a un item de la FAQ intitulé « Espaces indésirables sous les images » (mon dieu, mais personne ne lit cette FAQ Smiley bawling ). Je te laisse trouver l'adresse exacte.
mpop a écrit :
Tu n'aurais pas une page ou ligne, ou au pire une capture d'écran ?
Impossible de constater le rendu obtenu sans avoir les images sous la main.

Sinon, les blancs entre les lignes d'images viennent sans doute du fait qu'une image est considérée comme un caractère, positionné verticalement sur la ligne de base (baseline) et non pas tout en bas de la ligne de texte.
Il semblerait qu'en mode de rendu « quircks », ça ne soit pas le cas.
Mais utiliser ce mode de rendu de manière volontaire est, très probablement, une fort mauvaise idée !

Sur le positionnement vertical des images sur une ligne de texte, il y a un item de la FAQ intitulé « Espaces indésirables sous les images » (mon dieu, mais personne ne lit cette FAQ Smiley bawling ). Je te laisse trouver l'adresse exacte.



Je debarque sur le site, que je trouve pas mal du tout !
Donc apres avoir fait le tour sur le FAQ « Espaces indésirables sous les images », jai trouvé la soluce !
parmis les solutions proposées :

img {display: block;} Me petait toute la créa.
font-size: 1px sur l'élément contenant l'image / Me laissait 1px de decalage sur la derniere ligne d'img
line-height: 1px sur l'élément contenant l'image / Fonctionne nikel !
vertical-align: middle pour modifier l'alignement par défaut de l'image./ Jai pas testé !  [lol]


Merci pour ton aiguillage !
Sujet clos
Aller à