Centrer une image en CSS

Résolu/Fermé

dcourbineau Messages postés 4 Date d'inscription mercredi 9 février 2011 Statut Membre Dernière intervention 11 février 2011 - 9 févr. 2011 à 15:19
ccsfan - 2 juil. 2012 à 14:55

Bonjour,

Je souhaite centrer une image en CSS. Voici les données que j'ai déjà formulées, mais qui ne fonctionnent pas aux vues du résultat :

CSS :
img#logo
{
position : absolute;
top : 20px;
left: 50%;
}

Résultat : (C'est le texte pretty me qui est concerné)
http://www.prettyme.fr/indexfinal.html

Chose importante, je souhaite, ce quelque soit le navigateur, cette image soit centrée.

Quelqu'un peut-il m'éclairer?

Merci beaucoup

A voir également:

Centrer une image en CSS
Image iso - Guide
Légender une image - Guide
Transformer une image en icone - Guide
Comment agrandir une image - Guide
Acronis true image - Télécharger - Sauvegarde

3 réponses

Réponse 1 / 3

rudak Messages postés 590 Date d'inscription samedi 7 juin 2008 Statut Membre Dernière intervention 4 juin 2011 46
9 févr. 2011 à 15:27

si tu mets

left:50%

ton image va comencer a la moitié de l'écran (ou de l'élément relatif)

utilise une marge négative pour faire revenir ton image sur la gauche
utilise la moitié de la taille de ton image pour bien centrer le millieu

margin-left: -(width de ton image /2) px;

par exemple si ton image fait 311px de large (width) ton retrait sera de 155px

maiden65 Messages postés 483 Date d'inscription jeudi 27 janvier 2011 Statut Membre Dernière intervention 29 mars 2014 83
9 févr. 2011 à 15:29

Voila, c'est mieux quand même ^^

Réponse 2 / 3

dcourbineau Messages postés 4 Date d'inscription mercredi 9 février 2011 Statut Membre Dernière intervention 11 février 2011 1
9 févr. 2011 à 15:30

Explication très claire! Merci beaucoup, cela fonctionne à merveilles

Réponse 3 / 3

maiden65 Messages postés 483 Date d'inscription jeudi 27 janvier 2011 Statut Membre Dernière intervention 29 mars 2014 83
9 févr. 2011 à 15:27

Bonjour dcourbineau,

Personnellement je n'utilise que très rarement les fichiers CSS pour centrer une image, je fais plus avec du HTML :

<center> "ton image" </center>

ccsfan
2 juil. 2012 à 14:55

<center> fait partie des balises "deprecated". Elle fait partie des balises de mise en page qui ont disparu dès HTML4. Pour réaliser un site maintenable, il est indispensable de distinguer le contenu de la mise en page. On définit la structure logique avec HTML5 (et idéalement du PHP derrière) et des feuilles de style.

Discussions similaires

PIX

Impossible de télécharger photos messenger

Dechiffrer une image caché

image ?