hallo erstmal,
ich hab mir das menü von geo.de mal genauer angesehen, ich finde aber nicht den css-befehl wo die unterpunkte ausgeblendet werden wenn man nicht mit der maus drüber fährt.
hier der code:
/* global whitespace reset */
* { margin: 0; padding: 0; }
body {
font: 0.83em Verdana,Arial,sans-serif;
}
ul, li {
list-style: none;
z-index: 1;
}
ul.disc li {
list-style: disc;
margin-left: 25px;
}
acronym, abbr {
border-bottom: none;
}
/* invisible element */
.invisible {
position: absolute;
left: -1000px;
top: -1000px;
width: 0px;
height: 0px;
overflow: hidden;
display: inline;
}
/* clear floatings */
.clearFloat {
clear: both;
height: 1px;
line-height:0;
}
/* non-semantic italic and bold style */
.i { font-style: italic; overflow:auto; }
.b, .text-bold { font-weight: bold; }
.ok { color: #090; }
.error { color: #c00; }
.intro {
margin: 5px 0 20px 0;
line-height: 1.3em;
font-size: 0.93em;
font-weight: normal;
color: #6d6d6d;
}
/* ==== main navigation ==== */
#mainNav {
width: 824px;
font-size: 11px;
height: 21px;
border-right: 1px solid #999;
position: relative;
z-index: 200;
}
#mainNav ul {
visibility: hidden;
position: absolute;
left: 0;
top: 21px;
background: #fff;
padding-top: 2px;
z-index: 200;
display: inline;
}
#mainNav #topNav11 ul, #mainNav #topNav12 ul { margin-left: -77px; }
#mainNav li {
float: left;
text-align: center;
position: relative;
background: #fff;
}
#mainNav a {
text-decoration: none;
}
#mainNav .seperator, #mainNav #seperatorHalfpage {
float: left;
height: 20px;
width: 4px;
font-size: 1px;
border-left: 1px solid #999;
border-top: 1px solid #999;
}
#mainNav #seperatorHalfpage {
display: none;
}
#mainNav li a {
display: block;
float: left;
text-align: center;
padding: 3px 4px;
font-weight: normal;
color: #000;
border: 1px solid #999;
border-right: none;
}
#topNav1 a { width: 38px; }
#topNav2 a { width: 70px; }
#topNav3 a { width: 70px; }
#topNav4 a { width: 70px; }
#topNav5 a { width: 70px; }
#topNav6 a { width: 70px; }
#topNav7 a { width: 72px; }
#topNav8 a { width: 70px; }
#topNav9 a { width: 33px; }
#topNav10 a { width: 76px; }
#topNav11 a { width: 31px; }
#topNav12 a { width: 31px; }
/*#topNav4 { border: 1px solid red; }*/
#mainNav #topNavHalfpage { display: none; }
#mainNav #topNavHalfpage a { width: 154px; color: #999; }
body#start #mainNav #topNav1 a, #mainNav #topNav1 a:hover { color: #fff; background: #a8cd41; }
body#natur #mainNav #topNav2 a, #mainNav #topNav2 a:hover { color: #fff; background: #15a077; }
body#technik #mainNav #topNav3 a, #mainNav #topNav3 a:hover { color: #fff; background: #193370; }
body#mensch #mainNav #topNav4 a, #mainNav #topNav4 a:hover { color: #fff; background: #9e003a; }
body#kultur #mainNav #topNav5 a, #mainNav #topNav5 a:hover { color: #fff; background: #de6f03; }
body#reisen #mainNav #topNav6 a, #mainNav #topNav6 a:hover { color: #fff; background: #f1c213; }
body#fotografie #mainNav #topNav7 a, body#portfolio #mainNav #topNav7 a, #mainNav #topNav7 a:hover { color: #fff; background: #50595b; }
body#interaktiv #mainNav #topNav8 a, #mainNav #topNav8 a:hover, body#info #mainNav #topNav9 a, #mainNav #topNav9 a:hover, body#heftreihen #mainNav #topNav10 a, #mainNav #topNav10 a:hover, body#abo #mainNav #topNav11 a, #mainNav #topNav11 a:hover, body#shop #mainNav #topNav12 a, #mainNav #topNav12 a:hover, #mainNav #topNavHalfpage-active a, #mainNav #topNavHalfpage a:hover {
color: #fff; background: #a8cd41;
}
#mainNav ul li, #mainNav ul li a {
display: block;
text-align: left;
clear: both;
}
#mainNav ul li a {
padding: 2px;
border-left: 1px solid #999;
border-right: 1px solid #999;
border-top: none;
border-bottom: none;
color: #fff !important;
}
#mainNav ul li a:hover {
color: #000 !important;
}
#topNav1 ul li a { width: 145px; background: #a8cd41; }
#mainNav #topNav2 ul a { width: 170px; background: #15a077; }
#mainNav #topNav3 ul a { width: 100px; background: #193370; }
#mainNav #topNav4 ul a { width: 100px; background: #9e003a; }
#mainNav #topNav5 ul a { width: 120px; background: #de6f03; }
#mainNav #topNav6 ul a { width: 100px; background: #f1c213; }
#mainNav #topNav7 ul a { width: 130px; background: #50595b; }
#mainNav #topNav8 ul a, #mainNav #topNav9 ul a, #mainNav #topNav10 ul a, #mainNav #topNav11 ul a, #mainNav #topNav12 ul a {
width: 100px; background: #a8cd41;
}
#mainNav #topNav9 ul a { width: 120px; }
#mainNav #topNav10 ul a { width: 112px; }
#mainNav #topNav11 ul a { width: 112px; }
#mainNav #topNav12 ul a { width: 112px; }
body#start #mainNav #topNav1 ul a:hover, #mainNav #topNav1 ul a:hover { background: #cde599; }
body#natur #mainNav #topNav2 ul a:hover, #mainNav #topNav2 ul a:hover { background: #a3ecd6; }
body#technik #mainNav #topNav3 ul a:hover, #mainNav #topNav3 ul a:hover { background: #c7d8ff; }
body#mensch #mainNav #topNav4 ul a:hover, #mainNav #topNav4 ul a:hover { background: #f7cbe1; }
body#kultur #mainNav #topNav5 ul a:hover, #mainNav #topNav5 ul a:hover { background: #ffcb98; }
body#reisen #mainNav #topNav6 ul a:hover, #mainNav #topNav6 ul a:hover { background: #f4e5a7; }
body#fotografie #mainNav #topNav7 ul a:hover, body#portfolio #mainNav #topNav7 ul a:hover, #mainNav #topNav7 ul a:hover { background: #dbe2e4; }
body#interaktiv #mainNav #topNav8 ul a:hover, #mainNav #topNav8 ul a:hover, body#info #mainNav #topNav9 ul li a:hover, #mainNav #topNav9 ul li a:hover, body#heftreihen #mainNav #topNav10 ul li a:hover, #mainNav #topNav10 ul li a:hover, body#abo #mainNav #topNav11 ul li a:hover, #mainNav #topNav11 ul li a:hover, body#shop #mainNav #topNav12 ul li a:hover , #mainNav #topNav12 ul li a:hover {
background: #cde599;
}
#mainNav ul a.secondLevel { padding-left: 10px; width: 162px !important}
#mainNav .first { border-top: 1px solid #999; }
#mainNav .last { border-bottom: 1px solid #999; }
#mainNav li:hover>ul {
visibility: visible;
}
#blogNav {
float: right;
margin: -18px 2px 0 0;
}
#blogNav a {
display: block;
float: left;
width: 10px;
height: 11px;
text-align: center;
color: #fff;
text-decoration: none;
padding: 1px 1px 2px 1px;
margin-right: 1px;
}
#blogNav a:hover, #blogNav a.activeSlide {
font-weight: bold;
background-color: #d3a100;
}
danke!