Discussion :

[pierrot10]

Bonjour à tous,

J'ai un menu horizontal

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
<nav id="menu">
            <ul class="menu_ul"><li class="first level1 active"><a href="http://www.dd.biz/" title="Home" >Home</a></li>
<li class="level1"><a href="index.php?id=2" title="DK Management" >DK Management</a></li>
<li class="level1"><a href="index.php?id=3" title="Tangible assets" >Tangible assets</a></li>
<li class="level1"><a href="index.php?id=4" title="Security & Perfomance" >Security & Perfomance</a></li>
<li class="level1"><a href="index.php?id=5" title="Private Office" >Private Office</a></li>
<li class="last level1"><a href="index.php?id=6" title="Contact" >Contact</a></li>
</ul>

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
 
nav#menu{
	overflow:hidden;
	height:66px;
	width:auto;
}
 
nav#menu ul{
	margin-top:27px;
	text-align:center;
}
 
nav#menu ul li.active a{
	color:#a99a6f !important;
}
nav#menu ul li {
	list-style-type:none;
	float:left;
	border-right:1px solid #a99a6f;
	padding-right:8px;
	padding-left:8px;
	margin-left:0px;
	padding-top:1px;
}
 
nav#menu ul li:first-child{
	padding-left:0px;
}
nav#menu ul li:last-child{
	border-right:0px;
	padding-right:0px;
}
 
nav#menu ul li a{
	text-decoration:none;
	font-size:16px;
	font-weight:bold;
	text-transform:uppercase;
}
 
nav#menu ul li a:link, nav#menu ul li a:visited, nav#menu ul li a:active{
	color:#d31145;
}
 
nav#menu ul li a:hover{
	color:#a99a6f;
}

Pour les <li>, j'utilise

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

float:left

Pour que mes <li> soient aligner horizontalement
Mais le problème c'est que le menu s'aligne à gauche alors que je dois le centre, comme si j'utilisais text-align:center

Avant j'avais aussi utiliser

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

display:inline

Le problème c'est que je n'ai pas de controle sur la hauteur des <li>

Je souhaiterais savoir comment, je peux alirgner mon menu en utilisant le float pour les <li> et en sachant que le texte des menus peuvent changer.

Milles mercis

[NoSmoking]

Bonsoir,

Avant j'avais aussi utiliser

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

display:inline

Le problème c'est que je n'ai pas de controle sur la hauteur des <li>

je pense que tu veux dire largeur, il existe display:inline-block;