Posizionamento Sub menu orizzontale con liste <ul>

[Shiroga]

Buon giorno,
Devo creare un menù orizzontale utilizzando solo css 2.1 e HTML 4.0.1
Ho creato la prima parte del menù orizzontale utilizzando le liste <ul>. Ho un problema quando si tratta di posizionare il submenu che dovrebbe comparire sotto la casella su cui passo il mouse, come faccio ad individuare esattamente quel particolare <li> e dire che quel sub menù dovrebbe apparire allineato rispetto a quel <li>?

#header ul {
    margin: 5px;
    padding: 0;
    list-style-type: none;
}

#header ul li { 
    display: inline;
    background-color: transparent;
}

#header ul li a {
    padding: 10px 20px 10px 20px;
    color: #fff;
    text-decoration: none;
}

#header ul li a:hover {
    background-color: #4B4B4B;
}

#header div:first-child {
    margin-left:0px;
}

#header li:hover > ul {
    display: block
} 

#header ul ul li {
        position: relative;
}

.dropdown-nav {
    position: absolute;
    top: 60px;
    display: none;
    z-index: 99;
}

.dropdown-nav.uno {
    left: 21%;
}

.dropdown-nav.due {
    left: 560px;
}

.dropdown-nav.tre {
    left: 690px;
}

.dropdown-nav a {
    float: left;
    display: block;
    padding: 10px 20px 10px 20px;
    background-color: #fff;
    width: 100px;
    font-size: 14px;
    text-align: center;
    color: #000 !important;
    text-decoration: none;
    margin-top: 0px;
    border-top: none;
    border-bottom: 1px solid #c0c0c0 !important;
    border-left: 1px solid #c0c0c0 !important;
    border-right: 1px solid #c0c0c0 !important;

}

.dropdown-nav a:hover {
    background-color: #EFEFEF !important;
}

<div id="header">   
    <div id="title" class="section">GranDuca</div>      
    <div id="wrapper" class="section">
      <ul>
        <li>
          <a href="javascript:;">Personale</a> 
        </li>
        <li>
          <a href="/admin/view/main/roles.php">Mansioni</a> 
        </li>
        <li class="father">
          <a href="/admin/view/main/store.php">Magazzino</a>
          <ul class="dropdown-nav">
            <li> <a href="">Ristorazione</a></li>
            <li> <a href="">Vettovaglie</a></li>
            <li> <a href="">Pulizie</a></li>
          </ul>
        </li>
        <li class="father">
          <a href="/admin/view/main/hotel.php">Hotel</a>
          <ul class="dropdown-nav">
            <li> <a href="">Prenotazioni</a></li>
            <li> <a href="">Eventi</a></li>
            <li> <a href="">Affiliazioni Esterne</a></li>
          </ul>
        </li>
        <li class="father">
          <a href="/admin/view/main/fronted.php">Sezione Pubblica</a> 
          <ul class="dropdown-nav">
            <li> <a href="">Immagini</a></li>
            <li> <a href="">Testi</a></li>
            <li> <a href="">Tariffe</a></li>
          </ul>
        </li>
        <li class="father">
          <a href="/admin/view/main/customers.php">Clienti</a> 
          <ul class="dropdown-nav">
            <li> <a href="">Presenti</a></li>
            <li> <a href="">Passati</a></li>
          </ul>
        </li>
      </ul>
    </div>
    <div class="account link">
      <?php echo $email; ?> | <a href="javascript:;">LogOut</a> 
    </div>
  </div>

[Shiroga]

Ho commesso un errore nel postare questa conversazione, potreste eliminarla?