28173 sujets

CSS et mise en forme, CSS3

Bonjour,

Je viend de m'appercevoir qu'une de mes images n'est pas centrée dans mon bloc sous opéra (pour une fois IE7 met mon image ou je le désire Smiley biggol )

J'ai donc défini en css les infos de ma boite mail

.boitemail	{ 
	 
	padding: 12px;
	width: 300px;
	text-align: center;
	border-color: #CCCCCC;
	border-width: 6px;
	border-style: ridge;
	background-color: #00CC66;
}

.textecentre {text-align: center;}


et dans mon html

<div class="textecentre">
	<p class="boitemail">
			Contactez nous :<br />
			<a href="indexfr.php?page=mail">Contactez nous par E mail<br /><img src="/IMAGES/mail.gif" alt="" width="30" height="29" /></a> <br />
			Anne et Michel Condesse <br />
			BP 182 BORA BORA <br />
			98730 Polyn&eacute;sie Fran&ccedil;aise <br />
			Mobile : (689) 288 777 &amp; 720 356 <br />
			Tel/Fax: (689) 677 483 <br />
 </p>
</div>


je n'arrive pas a centrer et je ne trouve pas de solution soit le 'bloc' est centré mais pas l'image @ soit @ est centré mais pas le tout si quelqu'un en a une Smiley nut

http://www.aquasafaribora.com/anglais/indexen.php?page=presentation
undefined
Modifié par onibaba (03 Oct 2006 - 19:19)
Salut,

je pense qu'en rajoutant ça dans .boitemail ça devrait marcher :
margin-left:auto;
margin-right:auto;


@+
Modifié par Heyoan (03 Oct 2006 - 11:48)
Heyoan a écrit :
je pense qu'en rajoutant ça dans .boitemail ça devrait marcher :
margin-left:auto;
margin-right:auto;

Pour centrer le paragraphe portant la classe "boitemail", effectivement.
Mais la question porte (il me semble) sur le centrage de l'image de l'arobase dans le contenu de ce paragraphe.

Par contre, je l'ai bien vue centrée :
- sous Firefox 1.5 ;
- sous Opera 9.01.

Quel était la version d'Opera utilisée ?
Salut mpop,

il me semblait que c'était bien un problème de centrage du paragraphe car voilà ce que j'ai (avec Firefox) :

upload/8634-contactBora.png
Modifié par Heyoan (03 Oct 2006 - 12:37)
Heyoan a écrit :
Salut mpop,

il me semblait que c'était bien un problème de centrage du paragraphe car voilà ce que j'ai (avec Firefox) :

upload/8634-contactBora.png


En fait en relisant je viens de comprendre le truc :
onibaba a écrit :
Je viend de m'appercevoir qu'une de mes images n'est pas centrée dans mon bloc sous opéra (pour une fois IE7 met mon image ou je le désire biggol )
(...)
je n'arrive pas a centrer et je ne trouve pas de solution soit le 'bloc' est centré mais pas l'image @ soit @ est centré mais pas le tout si quelqu'un en a une nut

En lisant entre les lignes, on comprend effectivement qu'onibaba veut que à la fois le bloc (paragraphe) et l'image soient centrés.

Donc : largeur fixe et marges automatiques pour le bloc (ou simplement des marges de chaque côté pour arriver à la largeur voulue par déduction), et text-align: center sur le bloc pour obtenir le centrage du texte. Tout simplement.

Y aurait-il une difficulté cachée ?
Merci à tous

Effectivement le but etait d'avoir tout centré et avec les margin auto cela centre tout.
Mea culpa j'avais essayé le margin auto mais que pour un seul coté...

Merci encore et la prochaine fois j'essaierai d'être plus précis dans mes explications Smiley cligne