login  Naam:   Wachtwoord: 
Registreer je!
 Forum

Tweede nivo Suckerfish IE6 en 7 lijnt niet goed uit

Offline DeRick - 09/01/2010 22:45 (laatste wijziging 10/01/2010 14:17)
Avatar van DeRickNieuw lid Hoi,

Ik ben bezig met een menu voor een website. Nu lijnt in Internet Explorer 6 en 7 het tweede nivo van SuckerFish niet goed uit.

css code - Bekijk de code zonder highlighting - Klap code in 
  1. /* Algemeen en toplevel */
  2. #topmenu_items {float:left; width:100%; font-size:120%; margin: 6px 0 0 0;line-height: 35px;}
  3. #topmenu_items ul.menu {list-style: none; margin: 0; padding: 0 0 6px 0; line-height: 35px; display: block; height: 35px;}
  4. #topmenu_items ul.menu li {float: left; padding: 0; margin: 0 6px 0 0; height: 35px; display: block;}
  5. #topmenu_items ul.menu li a {float: left; padding: 0 12px 0 12px; margin: 0 0 12px 0; display: block; color: #555555; font-weight: bold; height: 41px; line-height: 35px;}
  6. #topmenu_items ul.menu li.active {background: url(../images/menu/topl_bg_r.png) top right no-repeat;}
  7. #topmenu_items ul.menu li.active a {color: #000000; background: url(../images/menu/topl_bg_l.png) top left no-repeat;}
  8. #topmenu_items ul.menu li:hover, #topmenu_items ul.menu li.sfhover {left: auto; background: url(../images/menu/topl_bg_r.png) top right no-repeat;}
  9. #topmenu_items ul.menu li:hover a, #topmenu_items ul.menu li.sfhover a {color: #000000; background: url(../images/menu/topl_bg_l.png) top left no-repeat; text-decoration: none;}
  10.  
  11. /* Dropdown en second level */
  12. #topmenu_items ul.menu li ul {left: -999em; position: absolute; top:47px;}
  13. #topmenu_items ul.menu li:hover ul, #topmenu_items ul.menu li.sfhover ul {z-index: 1002; left: auto; float: left; display: block; line-height: 2em; margin: 0 0 0 -5px; padding: 0 0 16px 0; width:197px; background: url(../images/menu/sec_bg.png) center bottom no-repeat;}
  14. #topmenu_items ul.menu li ul li {display:block !important; float: left; width:12em; height: 2em; left: auto; line-height: 2em; background: none !important; color: #181818; margin: 0 0 0 6px; padding: 0 0 5px 15px; width: 170px; border-bottom: #bcbcbc 1px solid;}
  15. #topmenu_items ul.menu li ul li a {background: none !important; font-size: 90%; font-weight: normal; margin: 0; padding: 0;}
  16. #topmenu_items ul.menu li ul li:hover, #topmenu_items ul.menu li ul li.sfhover  {background: #fff !important;}
  17. #topmenu_items ul.menu li ul li:hover a, #topmenu_items ul.menu li ul li.sfhover a {font-weight: bold;}
  18. #topmenu_items ul.menu li ul li.active {background: #fff !important;}
  19. #topmenu_items ul.menu li ul li.active a {font-weight: bold;}
  20.  
  21. /* IE7 fix */
  22. #topmenu_items li:hover, #topmenu_items li.sfhover {position: static;}




Het ziet er nu zo uit: http://image-shed.com/out.php/i1678_rotzooi.png

Ik hoop dat jullie mij kunnen helpen, heb echt al vanallerlei fixes geprobeerd.

Alvast heel erg bedankt,
Mvg,
Rick

Edit (10/01/2010): fixed:
css code - Bekijk de code zonder highlighting - Klap code in 
  1. #topmenu_items ul.menu li { position: relative; }
  2. #topmenu_items ul.menu li:hover ul, #topmenu_items ul.menu li.sfhover ul { position: absolute; left: 0; }

0 antwoorden

Gesponsorde links
Er zijn nog geen reacties op dit bericht.
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.193s