CSS Dropdown Menü im IE?

    Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

    • CSS Dropdown Menü im IE?

      Hallo alle!

      Ich habe gerade ein CSS-Dropdown Menü geschrieben, allerdings funktioniert dies nicht im IE.
      Ich kapier gerade nicht was ich machen muss :D

      Kann wer helfen? Unten ist die Datei mit aktuellen Aufbau.

      *lasst euch nicht vom Design stören, ist auf die schnelle gemacht worden

      PHP-Quellcode

      1. <!DOCTYPE HTML>
      2. <html>
      3. <head>
      4. <meta http-equiv="content-type" content="text/html; charset=windows-1250">
      5. <meta name="generator" content="PSPad editor, www.pspad.com">
      6. <title></title>
      7. <style>
      8. #wrapper{ padding:50px 0; width:980px; min-width:980px; margin:0 auto; border:1px solid #e4e4e4; background:#fff; -webkit-box-shadow: 0px 0px 1px 0px #c8c8c8;box-shadow: 0px 0px 1px 0px #c8c8c8; position:relative; }
      9. div.topnav{position:absolute; width:100%; min-width:980px; margin:0; }
      10. ul#topnav{ position:relative; z-index:9980; width:100%; min-width:930px; margin:0 0 25px; padding:0; height:35px; list-style:none; background: #d3d3d3;background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2QzZDNkMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjclIiBzdG9wLWNvbG9yPSIjZmZmZmZmIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iOTQlIiBzdG9wLWNvbG9yPSIjZTFlMWUxIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2M2YzZjNiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);background: -moz-linear-gradient(top, #d3d3d3 0%, #ffffff 7%, #e1e1e1 94%, #c6c6c6 100%);background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d3d3d3), color-stop(7%,#ffffff), color-stop(94%,#e1e1e1), color-stop(100%,#c6c6c6));background: -webkit-linear-gradient(top, #d3d3d3 0%,#ffffff 7%,#e1e1e1 94%,#c6c6c6 100%);background: -o-linear-gradient(top, #d3d3d3 0%,#ffffff 7%,#e1e1e1 94%,#c6c6c6 100%);background: -ms-linear-gradient(top, #d3d3d3 0%,#ffffff 7%,#e1e1e1 94%,#c6c6c6 100%);background: linear-gradient(to bottom, #d3d3d3 0%,#ffffff 7%,#e1e1e1 94%,#c6c6c6 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d3d3d3', endColorstr='#c6c6c6',GradientType=0 ); }
      11. ul#topnav li{ float:left; }
      12. ul#topnav li a{ border-right: 1px solid #D3D3D3; color: #000000; display: inline-block; font-weight: bold; padding: 10px 0; text-align: center; text-decoration: none; width: 108px; }
      13. ul#topnav li a:hover{ color:#2638D6; }
      15. .topnav ul {list-style-type:none; list-style-image:none; margin:0px; padding:0px;}
      16. .firstmenu ul li a:hover{ color:#2638D6; }
      17. .firstmenu ul{display:none;}
      18. .firstmenu:hover ul {display:block;z-index:99999;}
      19. .secondmenu {position:relative; clear:both; background: linear-gradient(to bottom, #D3D3D3 0%, #FFFFFF 7%, #E1E1E1 94%, #C6C6C6 100%) repeat scroll 0 0 transparent; border-bottom:1px solid #d3d3d3; width:108px; cursor:pointer;}
      20. .secondmenu a{border:0 !important;font-size:12px;clear:both; text-align:left !important; padding-left:10px !important;/* special IE6 */}
      21. </style>
      22. </head>
      23. <body>
      24. <div id="wrapper">
      25. <div class="topnav">
      26. <ul id="topnav">
      27. <li><a href="./index.php" id="homenav">Startseite</a></li>
      28. <li><a href="./portale.php" id="portalenav">Portale</a></li>
      29. <li class="firstmenu">
      30. <a href="./immobilien.php" class="immonav">Immobilien</a>
      31. <ul>
      32. <li class="secondmenu"><a href="./immoarchiv.php">Archiv</a></li>
      33. <li class="secondmenu"><a href="./vorlagen.php">Vorlage</a></li>
      34. <li class="secondmenu"><a href="./immobilien.php?action=import">Importieren</a></li>
      35. </ul>
      36. </li>
      37. <li><a href="./media.php" id="medianav">Mediathek</a></li>
      38. <li><a href="./kontaktpersonen.php" id="kontaktpersonnav">Kontaktperson</a></li>
      39. </ul><?php //UL ID TOPNAV ZU ?>
      40. </div>
      41. <div class="clear"></div>
      42. </div>
      43. </body>
      44. </html>
      Alles anzeigen

    • Werbung zur Unterstützung des Forums ( Bitte AddBlocker deaktivieren )

    • Hatte jetzt doch genügend Zeit das Problem selber an zu gehen.
      Falls es jemand haben will:

      PHP-Quellcode

      1. <!DOCTYPE HTML>
      2. <html>
      3. <head>
      4. <meta http-equiv="content-type" content="text/html; charset=windows-1250">
      5. <meta name="generator" content="PSPad editor, www.pspad.com">
      6. <title></title>
      7. <style>
      8. #wrapper{ padding:50px 0; width:980px; min-width:980px; margin:0 auto; border:1px solid #e4e4e4; background:#fff; -webkit-box-shadow: 0px 0px 1px 0px #c8c8c8;box-shadow: 0px 0px 1px 0px #c8c8c8; position:relative; }
      9. div.topnav{ position:absolute; min-width:980px; margin:0; }
      10. ul#topnav { min-width:930px; margin:0 0 25px; padding:0; height:35px; list-style:none; background: #d3d3d3;background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2QzZDNkMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjclIiBzdG9wLWNvbG9yPSIjZmZmZmZmIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iOTQlIiBzdG9wLWNvbG9yPSIjZTFlMWUxIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2M2YzZjNiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);background: -moz-linear-gradient(top, #d3d3d3 0%, #ffffff 7%, #e1e1e1 94%, #c6c6c6 100%);background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d3d3d3), color-stop(7%,#ffffff), color-stop(94%,#e1e1e1), color-stop(100%,#c6c6c6));background: -webkit-linear-gradient(top, #d3d3d3 0%,#ffffff 7%,#e1e1e1 94%,#c6c6c6 100%);background: -o-linear-gradient(top, #d3d3d3 0%,#ffffff 7%,#e1e1e1 94%,#c6c6c6 100%);background: -ms-linear-gradient(top, #d3d3d3 0%,#ffffff 7%,#e1e1e1 94%,#c6c6c6 100%);background: linear-gradient(to bottom, #d3d3d3 0%,#ffffff 7%,#e1e1e1 94%,#c6c6c6 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d3d3d3', endColorstr='#c6c6c6',GradientType=0 ); }
      11. ul#topnav li, div.topnav li.firstmenu { float:left; }
      12. ul#topnav li a{ border-right: 1px solid #D3D3D3; color: #000000; display: inline-block; font-weight: bold; padding: 6px 0; text-align: center; text-decoration: none; width: 108px; }
      13. ul#topnav li a:hover{ color:#2638D6; }
      15. .topnav ul {list-style-type:none; list-style-image:none; margin:0px; padding:0px;}
      16. .firstmenu a { float: left; }
      17. .firstmenu ul li a:hover{ color:#2638D6; }
      18. .firstmenu ul{ display:none; margin-top: -8px; }
      19. .firstmenu:hover ul {display:block;z-index:99999;margin-top: -8px;}
      20. .secondmenu { position:relative; clear: left; background: linear-gradient(to bottom, #D3D3D3 0%, #FFFFFF 7%, #E1E1E1 94%, #C6C6C6 100%) repeat scroll 0 0 transparent; border-bottom:1px solid #d3d3d3; width:108px; cursor:pointer;}
      21. .secondmenu a { border:0 !important;font-size:12px;clear:both; display: block; text-align:left !important; padding-left:10px !important;/* special IE6 */}
      22. </style>
      24. </head>
      25. <body>
      26. <div id="wrapper">
      27. <div class="topnav">
      28. <ul id="topnav">
      29. <li><a href="./index.php" id="homenav">Startseite</a></li>
      30. <li><a href="./portale.php" id="portalenav">Portale</a></li>
      31. <li class="firstmenu">
      32. <a href="./immobilien.php" class="immonav">Immobilien</a>
      33. <ul>
      34. <li class="secondmenu"><a href="./immoarchiv.php">Archiv</a></li>
      35. <li class="secondmenu"><a href="./vorlagen.php">Vorlage</a></li>
      36. <li class="secondmenu"><a href="./immobilien.php?action=import">Importieren</a></li>
      37. </ul>
      38. </li>
      39. <li><a href="./media.php" id="medianav">Mediathek</a></li>
      40. <li><a href="./kontaktpersonen.php" id="kontaktpersonnav">Kontaktperson</a></li>
      41. </ul><?php //UL ID TOPNAV ZU ?>
      42. </div>
      43. <div class="clear"></div>
      44. </div>
      45. </body>
      46. </html>
      Alles anzeigen