Deux menu en css sur meme page.
Bonjour
Actuellement en stage, je dois développer une application web.Pour le moment je suis qu'a la création de simple page html/css (Pour les maquettes écrans)et J'ai comme qui dirait un soucis. J'ai créer 3 bloc div. Sur deux des trois il y a un menu. Un vertical pour le menu de gauche et un horizontal sur un autre div. Les deux menus sont exactement identique au niveau du css, hormis le nom bien sur et la propriété float pour le menu horizontal ( valeur left ^^) mais voilà sous IE6 et firefox , il y a un soucis. le menu vertical marche trés bien , par contre le horizontal ne marche pas entièrement en effet il prend en compte que quelque paramètres.
Voici le CSS
Code:
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
55
56
57
58
59
60
61
62
63
64
| /* creation des onglets du bloc contenu*/
.navOnglet
{
width: 99%;
list-style-type: none;
margin: 0;
padding: 0;
border:0;
}
.navOnglet li
{
float:left;
width:33%;
border:1px solid #3B4E77;
padding:0;
}
.navOnglet li a:link
{
display: block;
height: auto;
color: #FFF;
background: #3B4E77;
margin: 0;
padding: 4px 8px;
border-right: 0px solid #fff;
text-decoration: none
}
.navOnglet li a:hover { background-color: #F2462E; }
.navOnglet li a:active { background-color: #5F879D; }
/*creation du menu de gauche*/
#menuGauche
{
width: 140px;
list-style-type: none;
margin: 0;
padding: 0;
border: 0;
}
#menuGauche li
{
margin: 0;
width:140px;
padding: 0;
border: 0;
}
#menuGauche li a:link, #menuGauche li a:visited
{
display: block;
height: auto;
color: #FFF;
background: #3B4E77;
margin: 0;
padding: 4px 8px;
text-decoration: none;
}
#menuGauche li a:hover { background-color: #F2462E; }
#menuGauche li a:active { background-color: #5F879D; } |
et voici le html
Code:
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
| <!-- Menu de navigation situé a gauche/ 3 option possible Acceuil/Saisie/recherche-->
<div id="menu">
<table width="99%" border="0" >
<tr>
<td width="99%" height="148" >
<ul id="menuGauche">
<li class="active"><a href="#">Acceuil</a></li>
<li><a href="#">Saisie</a></li>
<li><a href="#">Recherche</a></li>
</ul>
</td>
</tr>
</table>
</div>
<!------------------------------------------------------------------------------------>
<div id="contenu">
<table width="99%">
<tr>
<td width="99%" height="15%" >
<ul class="navOnglet">
<li class="active"><a href="#">INTERCOM</a></li>
<li><a href="#">INFOCOM</a></li>
<li><a href="#">TSVR</a></li>
</ul>
</td>
</tr>
</table>
<table width="100%" border="0" height="99%">
<tr>
<td width="99%" height="99%">
test
</td>
</tr>
</table>
</div> |
Je vous remerci de l'aide que vous pourrez m'apporter.
Cordialement
Nouvelle question : Bon je n ai toujours pas résolu mon soucis decris ci dessus. J ai rajouté des sous-menus à mon menu de gauche. Ca fonctionne trés bien sous firefox mais pas sous IE6. Un autre problème vient s ajouter à ca, c est que je suis en stage dans une branche du ministère des finances et je n'ai acces qu'a certain site donc j ai beau faire des recherches sur google la plupart, je n ai pas acces au réponse. Et je n ai pas trouvé ma réponse pour ma premiére question sur déveveloppez.com(et .net ).Donc si vous avez une solution à mon problème qui est en dehors développez.com pourriez vous me noter la solution sur vôtre réponse. Je vous en serez trés reconnaissant.Je souhaiterai vraiment réglé se problème avant la fin de la journée.
Merci
