nicht angemeldet
Hallo und ich bin am Ende,
das Problem ist, das mein "Drop Down Länderauswahl Menü" (oben rechts) hinter meinem Hauptmenü (darunter in rot) im IE 6 & 7
verschwindet. Im FF funkt alles...
Kann mir jemand helfen?
Z-Index habe ich schon bis zum kalten Knochenschlitterkotzen vergeben (sind aus dem Code jetzt wieder entfernt, bis auf einen, der jetzt für den FF notwendig ist), aber die haben nie etwas verändert/verbessert...
Gruss G
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <link rel="stylesheet" type="text/css" href="test.css" /> <title>Test</title> </head>
<body> <div id="main">
<div id="menu"> <div id="logo"><a href="#" alt="DUMMY" title="DUMMY"><img src="#" alt="DUMMY" title="DUMMY" width="72" height="114" /></a></div> <div id="top"> <div id="topmenu"> <div id="choosecountry"> <a class="uk" href="#" title="United Kindom">United Kindom<!--[if IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]--> <ul> <li><a class="germany" href="#" title="Deutschland">Deutschland</a></li>
<li><a class="uk" href="#" title="United Kindom">United Kindom</a></li> <li><a class="usa" href="#" title="USA">USA</a></li> </ul> <!--[if lte IE 6]></td></tr></table></a><![endif]--> </div> <ul> <li><a href="#" title="1">1</a></li>
<li><a href="#" title="2">2</a></li> <li><a href="#" title="3">3</a></li> <li><a href="#" title="4">4</a></li> <li><a href="#" title="5">5</a></li> </ul> </div> <div id="mainmenuouter"> <div id="mainmenu"> <ul> <li id="menu1"> <a href="#" title="Seite A"><span>Seite A</span><!--[if IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]--> <ul id="submenu1"> <li><a href="#" title="DUMMY">Seite 1</a></li> <li><a href="#" title="DUMMY">Seite 2</a></li>
<li><a href="#" title="DUMMY">Seite 3</a></li> </ul> <!--[if lte IE 6]></td></tr></table></a><![endif]--> </li> <li id="menu2"> <a href="#" title="Seite B"><span>Seite B</span><!--[if IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]--> <ul id="submenu2">
<li><a href="#" title="DUMMY">Seite 1</a></li> <li><a href="#" title="DUMMY">Seite 2</a></li> <li><a href="#" title="DUMMY">Seite 3</a></li> <li><a href="#" title="DUMMY">Seite 4</a></li> <li><a href="#" title="DUMMY">Seite 5</a></li> </ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]--> </li> <li id="menu3"> <a href="#" title="Seite C"><span>Seite C</span><!--[if IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]--> <ul id="submenu3"> <li><a href="#" title="DUMMY">Seite 1</a></li> </ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li> <li id="menu4"> <a href="#" title="Seite D"><span>Seite D</span><!--[if IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]--> <ul id="submenu4"> <li><a href="#" title="DUMMY">Seite 1</a></li> <li><a href="#" title="DUMMY">Seite 2</a></li>
<li><a href="#" title="DUMMY">Seite 3</a></li> <li><a href="#" title="DUMMY">Seite 4</a></li> </ul> <!--[if lte IE 6]></td></tr></table></a><![endif]--> </li> <li id="sitemap"> <a href="#" title="Sitemap"><span>Sitemap</span></a>
</li> </ul> </div> </div> </div> <div class="clear"></div> </div>
<div id="pageheader"> <img src="fileadmin/templates/mufin_corporation_site/img/dummy_head.jpg" width="660" height="241" alt="DUMMY"/>
</div>
<div id="pagecontent"> <h1>H1 Überschrift</h1> <p>Sed ut <strong>perspiciatis</strong> unde omnis iste natus error sit voluptatem accusantium<br /> doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi <a href="#" title="DUMMY">architecto</a> beatae vitae dicta sunt explicabo.</p> </div> </div>
</body> </html>
/* ############################################################## GLOBAL ############################################################## */
.clear { clear:both; margin:0; padding:0; }
html, body, a, a:link, a:visited, a:hover, a:active, img, table, td, tr, p, span, div, h1, h2, h3, h4, li, ul, ol { border:none; padding:0; margin:0; }
html { height:100%; }
body { height:100%; background:url(img/background.jpg) repeat-x; text-align:center; }
#main { margin:0 auto; width:660px; min-height:100%; background:url(img/bg_content.gif) top center repeat-y; }
- html div#main { height:100%; }
/* ############################################################## TOPMENU + LANGUAGES SELECT + MAINMENU ############################################################## */
#menu { background:url(img/bg_head.jpg) top left repeat-x; font-family:Arial, Helvetica, sans-serif; font-size:11px; padding:0 30px; height:114px; text-align:left; }
#logo { float:left; width:88px; height:114px; text-align:right; background:url(img/bg_menu_left.gif) bottom left no-repeat; border:1px solid green; }
#logo img { float:right; } /* FOR IE6 ONLY */
#top { float:left; width:512px; height:114px; }
/* TOPMENU */
#topmenu { width:512px; height:76px; }
#topmenu ul { float:right; padding:15px 0 0 10px; }
#topmenu li { float:left; padding:0 10px 0 0; list-style-type:none; }
#topmenu img { padding:0 5px 0 0; }
#topmenu a, #topmenu a:link, #topmenu a:active, #topmenu a:visited { color:#999; text-decoration:none; }
#topmenu a:hover { text-decoration:underline; }
/* LANGUAGES SELECT */
#choosecountry { position:relative; float:right; width:114px; padding:15px 0 5px 0; }
#choosecountry a, #choosecountry a:link, #choosecountry a:active, #choosecountry a:active, #choosecountry a:hover { background:url(img/flag_uk.gif) center left no-repeat; padding:0 0 0 27px; }
#choosecountry ul { position:absolute; top:33px; left:-5px; width:120px; height:0; visibility:hidden; background:url(img/menu_dropdown_lang.gif) top left repeat-x; padding:3px 5px; z-index:3; }
#choosecountry:hover ul { visibility:visible; height:auto; }
#choosecountry ul li { list-style-type:none; padding:1px 0; }
#choosecountry ul li a, #choosecountry ul li a:link, #choosecountry ul li a:visited, #choosecountry ul li a:active { width:120px; display:block; color:#ccc; }
#choosecountry ul li a:hover { text-decoration:none; color:#cc9933; }
#choosecountry ul li a.germany, #choosecountry ul li a.germany:visited, #choosecountry ul li a.germany:active, #choosecountry ul li a.germany:hover, #choosecountry ul li a.germany:link { background:url(img/flag_de.gif) center left no-repeat; }
#choosecountry ul li a.uk, #choosecountry ul li a.uk:visited, #choosecountry ul li a.uk:active, #choosecountry ul li a.uk:hover, #choosecountry ul li a.uk:link { background:url(img/flag_uk.gif) center left no-repeat; }
#choosecountry ul li a.usa, #choosecountry ul li a.usa:visited, #choosecountry ul li a.usa:active, #choosecountry ul li a.usa:hover, #choosecountry ul li a.usa:link { background:url(img/flag_us.gif) center left no-repeat; }
/* MAIN MENU */
#mainmenuouter { width:506px; height:38px; padding:0 6px 0 0; background:url(img/bg_menu_right.gif) bottom right no-repeat; }
#mainmenu { padding:0 0 0 10px; height:38px; background:url(img/bg_menu.gif) repeat-x; }
#mainmenu ul li { position:relative; float:left; list-style-type:none; border:1px solid red; }
#mainmenu a, #mainmenu a:link, #mainmenu a:active, #mainmenu a:visited, #mainmenu a:hover { display:block; }
#mainmenu span { display:none; }
#mainmenu ul li ul { position:absolute; top:38px; left:0; width:146px; height:0; visibility:hidden; background:url(img/menu_dropdown.gif) top left no-repeat; padding:5px; }
#mainmenu ul li ul li { padding:3px 0; clear:both; }
#menu1:hover #submenu1, #menu2:hover #submenu2, #menu3:hover #submenu3, #menu4:hover #submenu4 { width:120px; height:auto; visibility:visible; }
#mainmenu ul li ul li a, #mainmenu ul li ul li a:link, #mainmenu ul li ul li a:active, #mainmenu ul li ul li a:visited { background:none; width:146px; height:auto; color:#ccc; font-size:12px; text-decoration:none; }
#mainmenu ul li ul li a:hover { color:#cc9933; }
#menu1 a, #menu1 a:link, #menu1 a:active, #menu1 a:visited { height:38px; width:86px; background:url(img/menu_1.gif) top left no-repeat; display:block; } #menu1 a:hover, #menu1 a.active:hover { background:url(img/menu_1_hover.gif) top left no-repeat; display:block; } #menu1 a.active { background:url(img/menu_1_active.gif) top left no-repeat; display:block; }
#menu2 a, #menu2 a:link, #menu2 a:active, #menu2 a:visited { height:38px; width:64px; background:url(img/menu_2.gif) top left no-repeat; display:block; } #menu2 a:hover, #menu2 a.active:hover { background:url(img/menu_2_hover.gif) top left no-repeat; display:block; } #menu2 a.active { background:url(img/menu_2_active.gif) top left no-repeat; display:block; }
#menu3 a, #menu3 a:link, #menu3 a:active, #menu3 a:visited { height:38px; width:77px; background:url(img/menu_3.gif) top left no-repeat; display:block; } #menu3 a:hover, #menu3 a.active:hover { background:url(img/menu_3_hover.gif) top left no-repeat; display:block; } #menu3 a.active { background:url(img/menu_3_active.gif) top left no-repeat; display:block; }
#menu4 a, #menu4 a:link, #menu4 a:active, #menu4 a:visited { height:38px; width:76px; background:url(img/menu_4.gif) top left no-repeat; display:block; } #menu4 a:hover, #menu4 a.active:hover { background:url(img/menu_4_hover.gif) top left no-repeat; display:block; } #menu4 a.active { background:url(img/menu_4_active.gif) top left no-repeat; display:block; }
#sitemap a { margin:0 0 0 80px; height:38px; width:79px; background:url(img/menu_sitemap.gif) top left no-repeat; display:block; background-color:red;} #sitemap a:hover { background:url(img/menu_sitemap_hover.gif) top left no-repeat; display:block; background-color:red; } #sitemap a.active { background:url(img/menu_sitemap_active.gif) top left no-repeat; display:block; background-color:red; }
/* ############################################################## CONTENT ############################################################## */
#pageheader { height:240px; }
#pagecontent { padding:20px 50px 100px 50px; text-align:left; font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:16px; color:#666; }
#pagecontent h1, h2 { font-family:"Trebuchet MS",Helvetica; font-size:18px; padding:0 0 20px 0; }
#pagecontent p, #pagecontent img { padding:0 0 12px 0; }
#pagecontent ul { padding:0 0 12px 16px; }
#pagecontent ol { padding:0 0 15px 23px; }
#pagecontent a, #pagecontent a:link, #pagecontent a:active { color:#6666cc; text-decoration:none; }
#pagecontent a:hover { text-decoration:underline; }
#pagecontent a:visited { color:#993399; }