28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Je n'arrive pas à centrer un menu css

http://www.rlambay.lu/TEMP/marche/accueil.html

Quelqu'un peut-il m'aider SVP.

Merci d'avance

Romain

Ci-joint les codes html et css

<div id="tabs">



<ul>
 <li><a href="accueil.html"><span>accueil</span></a></li>
 <li><a href="menu.html"><span>menu</span></a></li>
 <li><a href="parcours.html"><span>parcours</span></a></li>
 <li><a href="../pdf/reservation.pdf" target="_blank" ><span>r&eacute;servation</span></a></li> 
 <li><a href="reglement.html"><span>réglement</span></a></li> 
 <li><a href="sponsors.html"><span>sponsors</span></a></li>
 <li><a href="http://www.scsteinfort.lu" target="_blank"><span>SCSteinfort</span></a></li>

</ul>
</div>


/*début menu*/
#tabs {
	
	width:1095px;
	font-size:90%;
	background-color: #ffffff;
	line-height:normal;
	padding-left:3px;
	overflow:hidden;
	margin-right:auto;
	margin-left:auto;
	}

#tabs ul {
	margin:0;
	padding:10px 10px 0 0px;
	list-style:none;
	
	}

#tabs li {
	display:inline;
	margin:0;
	padding:0;
	}

#tabs a {
	float:left;
	background:url("http://www.rlambay.lu/TEMP/marche/image/left.png") no-repeat left top;
	margin:0;
	padding:0 0 0 6px;
	text-decoration:none;
	}

#tabs a span {
	float:left;
	display:block;
	background:url("http://www.rlambay.lu/TEMP/marche/image/right.png") no-repeat right top;
	padding:6px 15px 4px 6px;
	margin-right:2px;
	color:#FFF;
	}

/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabs a span {float:none;}

/* End IE5-Mac hack */
#tabs a:hover span {
	}

#tabs a:hover {
	background-position:0% -42px;
	}

#tabs a:hover span {
	background-position:100% -42px;
	}
/*fin menu*/

Modifié par rlambay (02 Jun 2013 - 08:16)
salut,

#tabs {text-align: center;}
#tabs ul {display: inline-block;}

Ou bien donner une largeur à" #tabs ul" égale à sa dimension actuelle et lui appliquer un "margin:auto".
Nickel, un grand grand merci, ça fait deux heures que je cherche Smiley biggol
Modifié par rlambay (01 Jun 2013 - 14:27)
Zut et rezut,

Je viens de voir que sur Ie ca ne fonctionne pas

Par contre c'est nickel sous safari et firefox Smiley fache
salut,
quand tu dis IE tu dois parler de IE7. En fait IE7 ne reconnaît "inline-block" que sur les éléments de type en ligne. Pour le coup tu dois mettre un commentaire conditionnel pour ne cibler que IE7 et ajouter

#tabs ul {display:inline; zoom:1;}
Bonjour,

En effet, je viens de me rendre compte que j'avais toujours IE6 sur mon vmware fusion Smiley lol

J'ai installé la version 8 et tout est rentré dans l'ordre.

Merci pour votre aide Smiley clapclap Smiley clapclap Smiley clapclap

Romain