Menu CSS, aligner les sous-menu

Bonjour,

j'ai créé un menu dynamique en CSS avec un peu de Javascript. Maintenant je suis confronté à un petit soucis. Je souhaite que l'on puisse voir toutes les sous-catégories à l'écran. Un exemple :

Allez à :
http://www.netmovies.ch/NM2006/menu/fr_menu.html
(SVP, ne transmettez pas l'adresse)

Allez ici :
Par genre -> Etranger
Vous ne pourrez pas voir toutes les sous-catégories, une partie est masquées et une scrollbar apparait (dans votre fenêtre). Difficile de naviguer sur le site de cette manière.

Comment faire pour que toutes ces sous-catégories soient visibles? Oui, il y aurait :

top:-20px;

Par exemple. Mais je souhaite savoir s'il y a un moyen de juste lui dire que les sous-menus soient totalement visibles. Et surtout comment.

J'espère que je me suis fais comprendre.

Voici la feuille de style :

ul#menu li ul{
  display:none;
}

ul#menu li:hover>ul{
  display:block;
}

ul#menu{
  float:left;
}

ul#menu,
ul#menu ul{
  border:1px solid #00457A;
  list-style:none;
  margin:0px;
  padding:0px;
  width:148px;
  _width:150px;
  background-image:url("puce.gif");
  line-height:25px;
}

ul#menu ul{
  position:absolute;
  top:-1px;
  left:148px;
}

ul#menu li{
  position:relative;
  margin:0px;
  padding:0px;
  _display:inline;
}

ul#menu a{
  display:block;
  font-family:arial;
  font-size:12px;
  color:#FFFFFF;
  height:25px;
  text-decoration:none;
  text-align:left;
}

ul#menu a:hover{
  background:#FF6E00;
  display:block;
  font-family:arial;
  font-size:12px;
  color:#FFFFFF;
  height:25px;
  text-decoration:none;
  text-align:left;
}

a.puce{
  background:url("puce2.gif");
  background-repeat: repeat;
}

Merci