CSS Dropdown-Menü funktioniert nicht in IE8

Ich habe ein Dropdown-Menü in CSS erstellt.

Das Dropdown-Menü wird in Firefox, Chrome und IE8 korrekt dargestellt. Aber im IE8 kann ich die Auswahl nicht aus der Dropdown-Liste treffen. es verschwindet sofort ..

CSS-Datei ...

<code>ul {
/*  font-family: Arial, Verdana;
  font-size: 14px;*/
  margin: 0;
  padding: 0;
  list-style: none;
 }
ul li {
  display: block;
  position: relative;
  float: left;
}
li ul { display: none; }
ul li a {
  display: block;
  text-decoration: none;
  color: #ffffff;
  border-top: 1px solid #ffffff;
  padding: 5px 15px 5px 15px;
  background: #2C5463;
  margin-left: 1px;
  white-space: nowrap;
}
ul li a:hover { background: #617F8A; }
li:hover ul {
  display: block;
  position: absolute;
  left:none;
}
li:hover li {
  float: none;
  font-size: 11px;
}
li:hover a { background: #617F8A; }
li:hover li a:hover { background: #95A9B1; }
</code>

~

HTML (PHP-Datei hier ..)

<code><!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" xml:lang="en-gb" lang="en-gb" >
<HEAD>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<TITLE></TITLE>
<link rel="stylesheet" href="menu.css" type="text/css">
</HEAD>
<BODY>
<div id="header" class="top-bottom">
<ul id="menu">
  <li><a href="">Home</a></li>
  <li><a href="">Profile</a>
    <ul>
    <li><a href="./edit_profile.php">Edit Profile</a></li>
    <li><a href="">View Profile</a></li>
    <li><a href="">Add Education</a></li>
    </ul>
  </li>
  <li><a href="">My Connections</a></li>
  <li><a href="">Change Password</a></li>
</ul>
</div>
</code>

Antworten auf die Frage(1)

Ihre Antwort auf die Frage