Texte centré avec de par et d'autre une image

Bonjour

Je souhaite encadré un mot avec deux images qui sont un petit carré noir pour obtenir qqchose comme ceci :

image mot image


j'essaie de m'orienter ver cette piste mais j'ai l'impression qu'il est impossible d'utiliser background deux fois

# h3 {

text-align:center;
background: transparent url(../images/side_menu_black_lg_rectangle.gif) no-repeat left center;
background: transparent url(../images/side_menu_black_lg_rectangle.gif) no-repeat rightcenter;

}

Une bonne ame pourrais t'elle pointer son doiggt dans la bonne direction ?

Merci

Salut,

Soit tu mets tes deux images dans ton code HTML, soit, si elles ne sont que pure décoration et donc inutile dans le code HTML, tu rajoutes un niveau d'imbrication.

Qu'entend tu par niveau d'imbrication ?

est ce ceci ?

# h3 {
text-align:center;
background: transparent url(../images/image_gauche.gif) no-repeat left center;
}

# h3 span {
text-align:center;
background: transparent url(../images/image_droite.gif) no-repeat right center;
}

Mais cela ne marche pas

Merci

Et en passant ton span en display:block ?

Bah non plus voici la structure exacte :

<div id="Sidebar" >

	<div class="sidebarBox">
 		<h3>
			
				le mot
			
  		</h3>
</div>
</div>

et les css

#Sidebar h3  { 
		clear: both; 
		text-transform: lowercase;
		color: #000;
		font-weight: 700; 
		font-size: 1.4em; 
		margin: 0 0 0px 0;
		text-align:center;
	background: transparent url(../images/side_menu_black_rectangle.gif) no-repeat left center;
			
	}

#Sidebar h3 span { 
		clear: both; 
		text-transform: lowercase;
		color: #000;
		font-weight: 700; 
		font-size: 1.4em; 
		margin: 0 0 0px 0;
		text-align:center;
	background: transparent url(../images/side_menu_black_rectangle.gif) no-repeat right center;
		
	}

une idée?

Merci
Modifié par debutant_mais_motive (06 Oct 2009 - 12:18)

Bonjour et bienvenue parmi nous

En tant que modérateur, je me dois de te faire remarquer que tu n'as malheureusement pas respecté l'une des Règles de base du forum qui est d'afficher les codes et exemples proprement à l'aide des boutons [ code]... ici ton code HTML, CSS, PHP, etc.[ /code] (sans espace).

Je te remercie par avance de bien vouloir éditer tes messages afin de les rendre conformes à cette règle.

D'ailleurs, je rappelle que le lien "Aide" qui apparaît en haut du forum est important. Il contient des pistes de recherche, des indications sur les règles de vie de la communauté, etc.
Il serait courtois de ta part de bien vouloir en prendre connaissance.

Bonne continuation

Et il est où le span dans ton code HTML ?

oups je doit manquer de savoir je n'est pas compris la question ?

Qu'est-ce que tu n'as pas compris ? Span ? Code HTML ? Il est où ?

C'est comme ça ?

<div id="Sidebar" > 
 
    <div class="sidebarBox"> 
         <h3> 
             
                <span>le mot</span> 
             
          </h3> 
</div> 
</div> 

Merci

T'as essayé ?

Je viens d'essayer et cela à l'air de marcher avec en plus display:bloc

merci