Question sur l'ecriture de la balise <img> et son centrage

Bonjour à tous,


En cherchant une solution pour centrer mes images je me suis posé une question qui peut sembler idiote mais dans le doute je préfère la poser.

Par habitude, j'ai toujours placé les balises <img> dans des balises <p> mais est ce obligatoire? Ou plutot, est ce que ne pas utiliser <p> pose des problème de logique dans l'écriture du code.

Par ailleurs j'ai consulter la FAQ : http://forum.alsacreations.com/faq/#item74

J'aimerai savoir si on peut centrer des images directement en leur appliquant un CSS sur <img> ou si on doit obligatoirement les placer dans un bloc conteneur pour faire un centrage.

Salut,

percherie a écrit :
Par habitude, j'ai toujours placé les balises <img> dans des balises <p> mais est ce obligatoire? Ou plutot, est ce que ne pas utiliser <p> pose des problème de logique dans l'écriture du code.

Les balises img représentent un contenu en ligne (comme du texte) et doivent donc être placées dans des éléments comme les paragraphes.

Si tu veux pouvoir placer plus librement une image sur ta page, libre à toi de la transformer en élément de type block.

Par exemple :

img {display: block; border: 0 auto;}

Un peu de lecture supplémentaire :
http://forum.alsacreations.com/faq/#item62
Modifié par Eldebaran (31 Oct 2006 - 13:30)

le <p> en tant que tel n'est, je pense, pas obligatoire selon la nature de l'image ... Elle peut être contenue dans un <div>, dans un <ul><li> ou encore un <dl><dt><dd>, ça dépend de ce pour quoi elle est affichée et de sa "légende" ...

Dans mon cas, et pour l'instant je les utilisent dans deux situations :

Elles sont systématiquement placée dans un bloc "corps" et servent de graphique ou bien de photo illustrative.

Dans le cas de l'utilisation de graphique j'hésite à les placer dans des balises de définition mais la façon dont est présenter le texte est ambigu.
Je verrais bien les graphiques dans les balises <dd> mais le titre du graphique est également un <h2> qui introduit un nouveau paragraphe.

Pour que ce soit plus explicite voici une page en ligne : http://toutenkamion.net/maladies/hepatiteA.php

Le graphique ce situe au paragraphe "extension géographique"

Personnellement j'utiliserai bien des listes de définition mais avoir quelques avis sur la question et comment présenter ça serait sans refus.

a écrit :
J'aimerai savoir si on peut centrer des images directement en leur appliquant un CSS sur <img> ou si on doit obligatoirement les placer dans un bloc conteneur pour faire un centrage.

Il n'est pas possible de centrer l'image en appliquant une règle CSS à la balise <img /> si on conserve le rendu par défaut cet élément, qui est de type inline.

Mais tu peux éventuellement utiliser la propriété display pour passer à un affichage de type block, qui te permettra d'utiliser les marges automatiques, ou autre méthode de centrage des blocs.

En pratique, cependant, les images sont toujours placées dans un conteneur ... il est AMHA nettement plus efficace d'utiliser un text-align: center; sur le conteneur, plutôt que de bidouiller l'affichage par défaut.

Sachant que je place mes images à différent endroit de mon texte, j'ai tenté de trouver une solution sans utilisation de bloc spécifique.

J'ai donc trouvé une solution qui fonctionne bien, j'ai même d'ailleur ouvert un sujet pour comprendre comment ça fonctionne mais je n'ai eu aucune réponse.

Je précise que le code fonctionne très bien, j'ai juste envie de comprendre pourquoi : http://forum.alsacreations.com/topic-4-19325-1-Mon-code-fonctionne-mais-autant-comprendre-comment.html