Image sur un bouton

Bonjour,

Sur les boutons de navigation est-ce que c’est possible d’avoir l’image de fond
des boutons qui s’étirent en même temps que le texte.

Ci-joint une vignette :

#boutons {
	margin:0px;
	clear:both;
	float:right;
	position:relative;
	left:-51.50%;
	text-align:left;
	height:1.55em;
}

#boutons ul {
	list-style:none;
	position:relative;
	left:48.5%;
}
#boutons li {
	float:left;
	position:relative;
}

#boutons a {
           background:url(../Outils/Boutons/BtnOvaleBleu.png) no-repeat center;
	display:table-cell;
	text-decoration:none;
	margin:1px;
	float:left;
	text-align:center;
	color:#FFF;
	line-height:30px;
	height:30px;
	width:100px;
}

#boutons a:active{
	background:url(../Outils/Boutons/BtnOvaleRouge.png) no-repeat center;
	color:#FFF;
}	

#boutons a:visited {
	background:url(../Outils/Boutons/BtnOvaleRouge.png) no-repeat center;
	color:#FFF;
}	

#boutons a:hover {
	background:url(../Outils/Boutons/BtnOvaleRouge.png) no-repeat center;
	color:#FFF;
}

Merci pour votre aide.

Salutations.
Modifié par Laurie-Anne (31 Jan 2011 - 08:41)

Bonjour,

Avec CSS2, non.

Avec CSS3, oui avec background-size, mais ça ne sera pas supporté par tous les navigateurs.