Sitemap
Hierarchisch strukturiertes Menü, basierend auf einer Liste (ul), mit der Möglichkeit, Kommentare zu den einzelnen Rubriken einzublenden.
Der IE verschandelt dieses Layout leider, Funktionalität ist aber gewährleistet.
/* Sitemap */
#menue18 {
position: relative;
}
#menue18 ul {
list-style: none;
margin: 0;
padding: 0;
}
#menue18 li.level1 {
width: 100px;
padding: 2px 5px 2px 10px;
font-variant: small-caps;
border: 1px solid;
border-color: #3380cc #000 #000 #3380cc;
background-color: #035485;
color: #fc0;
}
#menue18 li.level2 {
width: 120px;
margin-top: 2px;
margin-left: 10px;
padding: 2px 5px;
border: 1px solid;
border-color: #3385ff #000 #000 #3385ff;
background-color: #0472b3;
color: #fc0;
}
#menue18 li.level3 {
width: 140px;
margin-top: 2px;
margin-left: 15px;
padding: 2px 5px;
border: 1px solid;
border-color: #39f #000 #000 #39f;
background-color: #048adb;
color: #fc0;
}
#menue18 li.level1 a,
#menue18 li.level2 a,
#menue18 li.level3 a {
display: block;
padding-left: 5px;
text-decoration: none;
}
#menue18 li.level1 a:link,
#menue18 li.level1 a:visited,
#menue18 li.level1 a:active {
background-color: transparent;
color: #e1cba2;
}
#menue18 li.level1 a:hover {
background-color: transparent;
color: #eee2cc;
width: auto;
}
#menue18 li.level2 a:link,
#menue18 li.level3 a:link,
#menue18 li.level2 a:visited,
#menue18 li.level3 a:visited,
#menue18 li.level2 a:active,
#menue18 li.level3 a:active {
background-color: transparent;
color: #eee2cc;
border: 1px solid;
}
#menue18 li.level2 a:link,
#menue18 li.level2 a:visited,
#menue18 li.level2 a:active {
border-color: #0472b3;
}
#menue18 li.level3 a:link,
#menue18 li.level3 a:visited,
#menue18 li.level3 a:active {
border-color: #048adb;
}
#menue18 li.level2 a:hover,
#menue18 li.level3 a:hover {
padding-left: 6px;
background-color: transparent;
color: #fff;
border: 1px solid;
}
#menue18 li.level2 a:hover {
border-color: #035485 #048adb #048adb #035485;
}
#menue18 li.level3 a:hover {
border-color: #0472b3 #24aafb #24aafb #0472b3;
}
#menue18 .level1 a span.info {
display: none;
}
#menue18 .level1 a:hover span.info {
position: absolute;
display: block;
top: 30px;
left: 220px;
width: 200px;
background: #035485;
color: #eee2cc;
padding: 10px;
font-variant: normal;
text-align: left;
border: 1px solid;
border-color: #3385ff #000 #000 #3385ff;
}