Div не отображается в TOP: CSS

Question

Я хочу создать меню выпадающего меню, но у меня возникла проблема, пожалуйста, помогите мне решить проблему. Моя учетная запись не отображается в верхней части других слоев. даже после применения z-индекса: 999; пожалуйста помоги.

MY HTML КОД ЗДЕСЬ

<nav id="menu"> 
    <ul id="floatright" style=""> 
     <li> 
     <a href="login.php">Sign in</a> 
      <div id="loginbox"> 
       <table> 
       <tr> 
       <td>Username </td><td><input type="text"></td> 
       </tr> 
        <tr> 
       <td>Username </td><td><input type="text"></td> 
       </tr> 
       </table> 
      </div> 
     </li> 
     <li> 
      - 
     </li> 
     <li> 
       <a href="signup.php">Join us</a> 
     </li> 
    </ul> 
</nav> 

Вот CSS-код

#menu { 
    height: 15px; 
    width: 900px; 
    background: #9a255a; 
    float: left; 
    padding: 10px 40px; 
    overflow: hidden; 
    color: #fff; 
    border-bottom: 1px solid #c53275; 
} 
#menu ul { 
    margin: 0px; 
    position: relative; 
    padding: 0px; 
    list-style: none; 
} 
#menu ul li { 
    float: left; 
    padding: 0px 10px; 
    display: block; 
    line-height: 17px; 
} 
#loginbox { 
    display: block; 
    position: absolute; 
    top: 5px; 
    right: 0; 
    z-index: 999; 
} 

Answer 1

теперь видеть эту ссылку обновления я здесь jsfiddlehttp://jsfiddle.net/G27EM/2/ я думаю, я решить вашу проблему.

Answer 2

Просто увеличить высоту #menu