En suivant les conseils qui m'ont été donnés ici j'ai fait de beaux menus qui marchent.
Qui marchent sur tous les navigateurs Mac (y compris IE). Qui marchent sur Firefox PC, mais qui sont en désordre sur IE6 PC.
Le désastre est visible ici :
http://www.quanta-tech.com/General/modele1.php
J'ai certainement du louper quelque chose, mais après avoir passé le WE dessus...
Si ça ennui pas trop voici mon code CSS :
Et le HTML qui va avec :
Merci si quelqu'un peut m'aider.
Hubert91
Modifié le 01 Feb 2005 - 10:52
Qui marchent sur tous les navigateurs Mac (y compris IE). Qui marchent sur Firefox PC, mais qui sont en désordre sur IE6 PC.
Le désastre est visible ici :
http://www.quanta-tech.com/General/modele1.php
J'ai certainement du louper quelque chose, mais après avoir passé le WE dessus...
Si ça ennui pas trop voici mon code CSS :
/* ceci concerne un menu horizontal placé à gauche à 20 px du bord/*
body {
margin: 0;
background-color: #ffffff;
font-family: arial, helvetica, verdana, sans-serif;
font-size: 1em;
}
.chapitremenu {
color: #d2691e;
font-weight: bold;
font-size: 0.85em;
line-height: 50%;
text-align: left
}
#navigation ul {
text-align: left;
text-indent: -20pt;
list-style-type: none;
float: left;
width: 100px
}
#navigation2 ul {
text-align: left;
text-indent: -20pt;
list-style-type: none;
float: left;
width: 100px;
margin-top: -15px;
}
#navigation3 ul {
text-align: left;
text-indent: -20pt;
list-style-type: none;
float: left;
margin-top: -15px;
width: 100px
}
#navigation li {
float: left;
}
#navigation2 li {
float: left;
}
#navigation3 li {
float: left;
}
#navigation a {
margin: 0 2px;
width: 100px;
height: 15px;
float: left;
font-weight: normal;
display: block;
font-size: 0.65em;
text-align: left;
border: 0;
color: purple;
text-decoration: none;
background: #ffffff;
}
#navigation2 a {
color: purple;
font-weight: normal;
font-size: 0.65em;
text-decoration: none;
background-color: #ffffff;
text-align: left;
float: left;
margin: 0 2px;
border: 0;
width: 100px;
height: 15px;
display: block
}
#navigation3 a {
color: purple;
font-weight: normal;
font-size: 0.65em;
text-decoration: none;
background-color: #ffffff;
text-align: left;
float: left;
margin: 0 2px;
border: 0;
width: 100px;
height: 15px;
display: block
}
#navigation a:hover {
background: #ffffff;
color: #d3691e;
}
#navigation2 a:hover {
color: #d2691e;
background-color: #ffffff
}
#navigation3 a:hover {
color: #d2691e;
background-color: #ffffff
}
Et le HTML qui va avec :
<div class="menugauche" title="summary site">
<div id="navigation" title="Acousto-optic products">
<ul>
<p class="chapitremenu">Acousto-Optic</p>
<li><a href=".."> Modulators</a></li>
<li><a href=".."> Deflectors</a></li>
<li><a href=".." target="_self"> Frequency Shifters</a></li>
<li><a href=".." target="_self"> Tunable Filters</a></li>
<li><a href=".." target="_self"> Polychromatic AOM</a></li>
<li><a href=".." target="_self"> Q-Switches</a></li>
</ul></div>
<div id="navigation2" title="Radio-Frequency products">
<ul>
<p class="chapitremenu">RF drivers</p>
<li><a href=".." target="_self"> Fixed Frequency</a></li>
<li><a href=".." target="_self"> Variable Frequency</a></li>
<li><a href=".." target="_self"> Power Amplifiers</a></li>
<li><a href=".." target="_self"> Polychromatic AOM</a></li>
<li><a href=".." target="_self"> Q-Switches</a></li>
</ul></div>
<div id="navigation3" title="Services">
<ul>
<p class="chapitremenu">Services</p>
<li><a href="" target="_self"> Custom design</a></li>
<li><a href="" target="_self"> Catalogs download</a></li>
<li><a href="" target="_self"> Company info</a></li>
<li><a href="" target="_self"> Contacts</a></li>
</ul></div>
</div><!--ferme menu gauche-->
Merci si quelqu'un peut m'aider.
Hubert91
Modifié le 01 Feb 2005 - 10:52