Discussion :

[kilinette]

Bonjour

Je viens de faire un menu en css (en m'inspirant d'un site ) mais j'aimerais savoir si je peux faire qq chose...

Voilà le code :

Code :

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
 
div#navbar2 {
    height: 30px;
    width: 100%;
    border-top: solid #000 1px;
    border-bottom: solid #000 1px;
    background-color: #336699;
}
div#navbar2 ul {
    margin: 0px;
    padding: 0px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: small;
    color: #FFF;
    line-height: 30px;
    white-space: nowrap;
}
div#navbar2 li {
    list-style-type: none;
    display: inline;
}
div#navbar2 li a {
    text-decoration: none;
    padding: 7px 10px;
    color: #FFF;
}
div#navbar2 li a:link {
    color: #FFF:
}
div#navbar2 li a:visited {
    color: #CCC;
}
div#navbar2 li a:hover {
    font-weight: bold;
    color: #FFF;
    background-color: #3366FF;
}

En html :

Code :

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

1
2
3
4
5
6
7
8
 
<div id="navbar2">
<ul>
<li><a href="link1.html">Bouton 1</a></li>
<li><a href="link2.html ">Bouton 2</a></li>
<li><a href="link3.html ">Bouton 3</a></li>
</ul>
</div>

Voilà, cela fait bien les onglets, comme je le souhaite Mais là ils sont alignés à partir de la gauche du corps de la page... Serait-il possible de les centrer ? (sans que cela soit trop compliqué, sinon je m'en passe )

Merci bcp

[Shivaneth]

Code :

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

1
2
3
4
5
6
7
8
9
<div id="navbar2">
<center>
<ul>
<li><a href="link1.html">Bouton 1</a></li>
<li><a href="link2.html ">Bouton 2</a></li>
<li><a href="link3.html ">Bouton 3</a></li>
</ul>
</center>
</div>

tout simplement

[ilood]

ou

Code :

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

1
2
3
div#navbar2 ul {
	text-align: center;
}

[kilinette]

Honte à moi, c'était si simple et je n'ai pas trouvé en cherchant sur des sites

Merci bcp, ça marche pil poil

[koala64]

Salut, :o

La 2nde solution est quand même la meilleure car les balises center, bien qu'elles fonctionnent, tendent à devenir obsolètes...