18067 sujets

Questions générales et questions de débutants

Menu déroulant horizontal sur deux lignes : centrage possible ?

Bonjour

j'ai fait mon propre menu déroulant à moi tout seul comme un grand, mais bon, il ressemble fortement à celui-ci.
Du coup je vous remet pas le code, puisque c'est presque le même que le précédent Smiley cligne

le problème est le suivant : le conteneur du menu a une largeur fixe, et je veux que le sous-menu soit centré dans celui-ci (pas le menu principal, histoire d'être bien chiant), sachant que le nombre d'éléments du sous-menu est variable (dynamique).
Avec le sous-menu positionné en absolu, je vois pas trop comment faire, et je vois pas comment le positionner autrement Smiley confus

donc ouala, ça serait super top que vous puissiez m'aider Smiley lol

merciiii Smiley biggrin
Salut,

p'têt je vais me faire taper sur les doigts par les autres pasque peut être qu'il y'a plus simple et plus mieux, mais pourquoi ne pas utiliser le même principe que pour centrer le conteneur des sites centrés ?


	width: [X]px;
	position: absolute;
        top: 0px;
	left: 50%;
	margin-left: [0.5X]px;
ben ça serait pas mal, mais je ne connais pas la taille du sous-menu à l'avance... Smiley confus (étant donné que le nombre d'éléments change dynamiquement).
Bonjour,
tu peux aligner les items de menus centrés dans leur conteneur avec text-align:center appliqué au conteneur; Puisqu'ils sont en display:inline; et donner la même largeur aux sous-menus, au menu et à son conteneur Smiley biggrin
Modifié par chmel (13 Jun 2006 - 14:02)
amarche pas Smiley bawling

voici mon css :
#planet_menu {
	width: 578px;
	height: 15px;
	margin: 0;
	padding: 0;
	padding-bottom: 14px;
	list-style-type: none;
	background-color: #E01B00;
	color: black;
	font-size: 12px;
	border-right:1px solid #E01B00;
	position: relative;
	text-align: center;
}
#planet_menu li {
	display: inline;
	float: left;
	border-left: 1px solid #E01B00;
	background-color: white;
	padding: 0;
}
/*
 * SOUS-MENU
 */
#planet_menu ul {
	background: #E01B00;
	color: white;
	position: absolute;
	top: 15px;
	left: 0;
	margin: 0;
	padding: 0;
	width: 578px;
	height: 14px;
	display: none;
	text-align: center;
}
#planet_menu li li {
	background: #E01B00;
	color: white;
	border: 0;
	padding: 0 5px;
	border-left: 1px solid white;
	font-size: 11px;
}


et mon html, ma foi, ce sont des <ul> imbriqués (je copie-colle pas, y'a plein de php au milieu), genre :


<ul>
  <li>element1
    <ul>
      <li>souselement</li>
    </ul>
  </li>
</ul>
Sujet clos
Aller à