grazioli |
13.08.2006 20:04 |
Hallo,
ich habe bereits ein Menü auf UL und LI
Code:
<ul id="Navigation">
<li><span class="Navigation">Angebot</span>
<ul>
<li><a href="angebotberatung.htm">Ernährungsberatung</a></li>
<li><a href="angebotkurse.htm">Kurse / Seminare</a></li>
<li><a href="angebotvortraege.htm">Vorträge</a></li>
<li><a href="angebotsupervision.htm">Supervision</a></li>
<li><a href="angebotmedien.htm">Medien</a></li>
<li><a href="angebotprojekt.htm">Projekte</a></li>
</ul>
</li>
<li><a href="tarife.htm">Tarife / Honorare</a></li>
<li><a href="person.htm">zur Person</a></li>
<li><span class="Navigation">Referenzen</span>
<ul>
<li><a href="referenzenkurse.htm">Kurse</a></li>
<li><a href="referenzenmedien.htm">Medien</a></li>
<li><a href="referenzenprojekt.htm">Projekte</a></li>
</ul>
</li>
<li><span class="Navigation">Kontakt</span>
<ul>
<li><a href="kontaktformular.php">Kontaktformular</a></li>
<li><a href="anfahrtsweg.htm">Anfahrtsweg</a></li>
</ul>
</li>
<li><span class="Navigation">Links</span>
<ul>
<li><a href="linksernaehrung.htm">Ernährung</a></li>
<li><a href="linkszeitschriften.htm">Zeitschriften online</a></li>
<li><a href="linksdiverse.htm">Diverse</a></li>
</ul>
</li>
</ul>
mit diesem CSS
Code:
#Lmenu{
vertical-align: 2%;
padding-top: 2.5em;
}
div#Tmenu div {
clear: left;
cursor: pointer;
}
ul#Navigation {
margin: 0;
padding: 0;
text-align: center;
}
ul#Navigation li {
list-style: none;
float: left;
position: relative;
margin: -0.0495em;
padding: 0;
}
* html ul#Navigation li {
margin-bottom: -0.4em;
}
ul#Navigation li ul {
margin: 0;
padding: 0;
position: absolute;
list-style: none;
float: left;
}
* html ul#Navigation li ul {
left: -0em;
lef\t: -0em;
}
ul#Navigation li ul li {
float: none;
display: block;
margin-top: -0.1em;
margin-bottom: -0.1em;
font-size: 11px;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
}
ul#Navigation a, ul#Navigation span {
display: block;
width: 11em;
font-weight: bolder;
padding-bottom: 0.5em;
padding-top: 0.5em;
border: 1px solid #000000;
background-color: #DBDCDD;
color: #339933;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
}
* html ul#Navigation a, * html ul#Navigation span {
width: 10em;
w\idth: 11em; /* IE 6 in standards-compliant mode */
}
ul#Navigation a:hover, li a#aktuell:hover {
padding-bottom: 0.5em;
padding-top: 0.5em;
border: 1px solid #000000;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: bolder;
background-color: #CCCCCC;
color: #339933;
}
ul#Navigation span {
padding-bottom: 0.5em;
padding-top: 0.5em;
border: 1px solid #000000;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: bolder;
}
ul#Navigation li ul a:hover {
border: 1px solid #000000;
background-color: #CCCCCC;
color: #339933;
}
li a#aktuell {
border: 1px solid #000000;
}
ul#Navigation li ul span {
border: black;
}
ul#Navigation li a:active, ul#Navigation li:hover a:active {
color: black;
background-color: #DBDCDD;
}
/* dynamisches Ein-/Ausblenden */
ul#Navigation li ul {
display: none;
}
ul#Navigation li:hover ul {
display: block;
}
Darum kann ich nicht noch ein UL und LI erstellen.
das Problem ist, dass der IE mir einen Teil der Auflistung links abschneidet, wenn ich nicht 15px setzte! Und der Opera und Firefox setzt es halt auf 15px!
Giebt es keine andere Lösung?
Danke und Gruss
Simon
|