centrer une image

**lgarras** · 28/08/2012, 11h02

Bonjour à tous,

Je voudrais afficher une image au milieu de la page.
J'ai fait ce bout de code qui m'affiche bien l'image mais pas au milieu de la page...
Est ce que quelqu'un à une idée de pourquoi ça marche pas?

Merci d'avance.

Code html :

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

<img src="../images/message.jpg" width="632" height="242" style="margin:auto;">

**MinDBuSteR** · 28/08/2012, 11h25

Essaye :

Code :

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

echo '<img src="../images/message.jpg" width="632" height="242" style="margin:auto;text-align:center;">';

Pour plus d'info rends toi dans la partie CSS

**lgarras** · 28/08/2012, 11h34

Merci de ta réponse.
J'ai essayé ça marche toujours pas....

**Benjamin Delespierre** · 28/08/2012, 14h41

margin: auto ne fonctionne que pour les éléments de type bloc, pour les élément inline, il faut utiliser text-align: center sur l'élement parent.

Voici comment centrer une image seule:

Code HTML :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<html>
<head>
    <title>TEST</title>
    <style type="text/css" media="screen">
    html, body {
        width: 100%;
        height: 100%;
        margin: 0px;
        padding: 0px;
    }
    /* centrage horizontal */
    body > img {
        display: block;
        margin: auto;
    }
    /* centrage horizontal+vertical */
    body > img.center {
        display: block;
        margin: 0px;
        position: absolute;
        top: 50%;
        left: 50%;
        margin-top: -142px;
        margin-left: -150px;
    }
    </style>
</head>
<body>
    <img class="center" src="http://whfb.lexicanum.com/mediawiki/images/thumb/2/23/StoneTroll.jpg/300px-StoneTroll.jpg" width="300" height="285" />
</body>
</html>

**v1cent** · 28/08/2012, 15h39

en fait, tout dépend de ton environnement, on ne peut pas savoir pourquoi ton image n'est pas alignée sans avoir le code autour

centrer une image

Centrer un élément en CSS

Vue hybride

Discussions similaires

Partager

Partager