Bonjour à tous,
le problème dont je viens vous parler ici concerne cette page de mon site: http://r0d.developpez.com/yatus/index.html
C'est sur le menu horizontal en haut. Ce que j'ai fait, c'est une image de fond et une liste de 3 liens.
Voici mon code css:
Et la partie html:
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
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54 #yatus_common { width:100%; text-align:center; margin:0; padding:0; font-family : "Trebuchet MS","Verdana",Times, serif; } #yatus_menu { width:100%; height:66px; padding:0; margin:0; background-image:url('./bg_banner.gif'); background-position:center; background-repeat:no-repeat; text-align:center; } #yatus_menu ul { margin: 0 0 0 150px; padding: 0; } #yatus_menu ul li { position:relative; margin: auto; padding: 0; display: inline; list-style: none; } #yatus_menu ul a { line-height: 24px; font-weight: normal; font-size:24px; margin: 0 50px 0 10px; padding-top:20px; text-decoration: none; color: #000000; background-color: transparent; } #yatus_menu ul a:hover { color: #057e0f; background-color:transparent; }
En fait, je ne suis pas totalement satisfait du résultat, car je voudrais pouvoir décaler les 3 liens de mon menu un peu à gauche, pour le centrer un peu mieux sur l'image de fond. Vous voyez ce que je veux dire? Savez-vous comment faire?
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 <div id="yatus_common"> <img id="centered" src="yatus_banner.png"> /* ça c'est la bannière tout en haut */ <br> <br> <div id="yatus_menu"> <br> <ul> <li><a href="index.html"> présentation </a></li> <li><a href="regles.html"> règles </a></li> <li><a href="dev.html"> le coin des développeurs </a></li> </ul> </div> </div>
Partager