Version imprimable
Bonjour,
Je ne suis pas très doué en HTML...ma question est possiblement simple.
En spécifiant ce DOCTYPE, j'ai un petit espace en dessous d'une image sur Firefox
Petit espace que je n'ai pas si je ne spécifie pas de DOCTYPE.Code:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Est-ce que quelqu'un connaît ce problème ?
Est-il possible de supprimer l'espace et de garder l'encodage ?
D'avance merci de votre aide.
-Tsalm
Bonjour,
je ne sais pas si c'est dû au doctype mais essayez d'ajouter cette portion de code à votre image :
Code:
2
3
C'est probablement le code HTML autour de l'image, qui n'est pas interprété pareil s'il y a un doctype ou pas de doctype. Il faut nous montrer le code ou l'URL (pas la peine de poster 15 millions de lignes non plus. Juste le problème, ça suffira.)
Pour résoudre le soucis il suffira de mettre un balisage correct, et éventuellement de régler marges et padding en CSS.
Bonjour,
les balises IMG sont par défaut en mode de rendu display:inline, ce qui explique l'espace prévue pour l'affichage des jambes des lettres, pqjgy.
La solution préconisée par rodolphebrd devrait supprimer cette espace.
L'utilisation d'un DOCTYPE valide évite aux navigateurs de faire leur propre interprétation et te garantira un minimum de surprise.
A l'heure actuelle il n'est quand même pas bien compliqué de mettre un <!DOCTYPE html> en première ligne d'un fichier HTML.
Bonjour TSalm,
Pourquoi avez-vous choisi ce DOCTYPE ?
Ouais enfin ça n'a aucun rapport avec la question, hein.
C'est sûr que c'est pas la peine de s'embêter avec doctype à rallonge, surtout un faux doctype XML, mais c'est pas ça qui joue sur le problème soulevé.
Salut ;)
thelvin :
TSalm dit qu'avec CE doctype il a un soucis alors je lui donne un lui pour qu'il sache et utilise le bon doctype en fonction de ses besoins.
TSalm :
Selon votre navigateur utiliser firebug (http://eric-pommereau.developpez.com...l-web/firebug/) ou autre pour vérifier votre élément en question. Essayez également un margin et padding à 0.
Concernant la relation avec le doctype, cet espacement est l'une des différences de rendu entre le choix d'un doctype transitionnel ou strict (en html 4.01 ou html 1.0).
La raison a été donnée par NoSmoking, une solution par rodolphebrd. Si le display:block n'est pas envisageable, on peut jouer avec la propriété vertical-align. Au lieu du vertical-align: baseline par défaut, un vertical-align:bottom, voire middle devrait aussi le faire disparaître.
Cependant, si le line-height vient à dépasser la hauteur de l'image on peut le voir réapparaître (en haut si vertical-align:bottom, haut et bas si vertical-align:middle). Auquel cas un line-height de 0 est censé le faire disparaître. depuis que les navigateurs sont équipés d'un zoom page plutôt qu'un zoom text seul, le cas devient rare.
J'ai essayé le code suivant:
Code:
2
3
Code:
2
3
4
5
6
7
et j'obtiens le même résultat sur Safari, Firefox et Chrome:
- sans doctype;
- en html5;
- en xhtml 1.0 strict;
- en xhtml 1.1;
- en html 4.01 transitional;
- en html 4.01 strict;
Merci à tous, ça fonctionne très bien avec le display:block ! :ccool:
Et merci à tous pour vos explications sur le DOCTYPE.