Décalage de l'image dans un <figure>

**Obi Juan Kenobi** · 11/01/2017, 18h40

Bonjour la communauté des développeurs,

Faisant suite à ma formation, je vous soumets un problème dont mon enseignant ne m'a pas apporté de solution.

Considérons le code suivant :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
<figure><img src="image.jpg" alt="" title="">
     <figcaption>Légende de la photo.</figcaption>
</figure>

La balise <figure> sert au référencement et permet de dynamiser les images dans les recherches grâce à un nom qui a un sens. Ainsi, lorsqu'on utilise Google images, pour peu que les noms des fichiers soient sémantiques, et non du genre "image1.jpg" ou "mon_image.jpg", mais plutôt du genre "entree_du_musee_du_louvre.jpg" ou encore "vaches_paitrant_dans_un_pre.jpg", les photos auront un meilleur classement dans les pages.

Mais, quand on exécute la page HTML sur un navigateur, il y a un décrochage sur le côté gauche comme si on avait mis une indentation : la photo n'est plus alignée à gauche avec le texte d'en dessous !
Ma question est la suivant : y a-t-il moyen d'éviter cela ? Si oui, comment faire ?

Merci pour vos réponses.

**Bisûnûrs** · 12/01/2017, 10h50

De base, le HTML ne génère pas de décalage. Il s'agit soit d'un problème dans ton CSS, soit d'une feuille de style par défaut de ton navigateur.
Un lien représentant ton problème serait le bienvenu.

**Obi Juan Kenobi** · 12/01/2017, 11h04

Salut Bisûnûrs,

J'ai trouvé la solution grâce à un développer. Il suffit de réinitialiser dans les CSS la plupart des balises HTML.
Il m'a donné le lien suivant : http://meyerweb.com/eric/tools/css/reset/

Puis, il m'a dit de copier le code et de le placer dans une feuille de styles CSS puis de l'appeler dans le <head> avec la balise <link>.
J'ai essayé et ça m'a mis toutes les images au bord à gauche et les autres éléments aussi se sont calés partout.

Merci pour ton intervention.

That's all folk's!

Décalage de l'image dans un <figure> [HTML 5]

HTML

Discussions similaires

Partager

Partager