centrer une image

Version imprimable

28/08/2012, 10h02
lgarras

centrer une image

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:

<img src="../images/message.jpg" width="632" height="242" style="margin:auto;">
28/08/2012, 10h25
MinDBuSteR

Essaye :

Code:

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
28/08/2012, 10h34
lgarras

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

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:

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>

28/08/2012, 14h39
v1cent

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