Michel Beischer: <ul> :hover im Internetexplorer

Beitrag lesen

Hallo,

Ich bin gerade in der Ausbildung zum IT-Kaufmann und arbeite im Moment daran eine Internetseite möglichst Barrierefrei umzugestalten.

Eine Tabellen Navigation scheidet, wie ich mitbekommen habe, ja nun vollkommen aus, weswegen ich nun alles mit CSS gestalte.

Die Navigation, welche ich gestaltet habe besteht aus einer Liste mit mehreren Unterpunkten, die beim überrollen der ul li Elemente "aufklappen" sollen. Der Code, den ich dafür geschrieben habe ist folgender:

.navigation_menu {font-family: Arial;
      margin: 0 auto;
      list-style:none;
      width: 150px;
      border-bottom:1px solid #D0D9F4;}

ul li   {position: relative; right:40px;}

li ul   {position: absolute;
      left: 149;
      top: 0;
      display: none;
      font-family: Arial;}

#menu_link   {display: block;
      font-family: Verdana,Tahoma,Arial,sans-serif;
      font-size: 10pt;
      font-weight: bold;
      text-decoration: none;
      color: #001E6A;
      background: #ECF1FE;
      padding: 5px;
      border-left: 3px solid #A0B3EA;
      border-top: 1px solid #D0D9F4;
      border-right: 1px solid #D0D9F4;}

#menu_link_b   {font-family: Verdana,Tahoma,Arial,sans-serif;
      font-size: 10pt;
      font-weight: bold;
      display: block;
      text-decoration: none;
      color: #D6DEF6;
      background: #A0B3EA;
      padding: 5px;
      border-bottom: 0;
      border-top: 1px solid #D0D9F4;
      border-right: 1px solid #D0D9F4;
      border-left: 1px solid #D0D9F4;}

#menu_link:hover  {color: #FFFFFF;
      background: #B5C4EF;
      border-left: 3px solid #001E6A;}

#menu_link_b:hover  {color: #FFFFFF;
      background: #B5C4EF;}

* html ul li   {width:150px;
      float: left;}
  * html li ul a  { height: 1%;}

ul li a:hover   {color: #FFFFFF; background: #B5C4EF;}

li:hover ul,li.over ul {display: block;}

Nun will das Menu aber bei der Benutzung des Internetexplorers nicht ausklappen. Ich habe gehört, dass es daran liegt, dass der Internet Explorer keine :hover Effekte für Pseudo Elemente interpretiert. Gibt es dafür einen hack, welcher das Problem beheben kann ?

Ich bin für jede Hilfe dankbar, denn das treibt mich hier bald zur Weissglut ;)

MFG

Michel Beischer