Listy rozwijane [CSS + HTML] Opcje

[pietrov8]

Witam.

Mam taki problem nurtujący mnie od dobrych kilku dni. Mianowicie.

[HTML] pobierz, plaintext 
<ul>
      <li><a href="#">Link 1</a></li>
      <li><a href="#">Link 2</a>
             <ul>
                    <li><a href="#">Sublink 1</a></li>
                    <li><a href="#">Sublink 1</a></li>
             </ul>
      </li>
      <li><a href="#">Link 3</a></li>
      <li><a href="#">Link 4</a></li>
</ul>
[HTML] pobierz, plaintext 

Powyższy kod przedstawia strukturę mojego menu. Teraz zaprezentuję kod CSS który sprawi że to menu zadziała:

[HTML] pobierz, plaintext 
ul{list-style:none;}
ul li{float:left; display:inline; position:relative; padding:12px;}
ul li > ul{display: none;}
ul li:hover > ul{display: block; position:absolute; left:0px;}
ul li:hover > ul li{float:none; padding:0;}
[HTML] pobierz, plaintext 

I wszystko działa jak należy. Tylko gdy w ul rozwijanym w li pojawi się tekst dłuższy niż li nadrzędne to wtedy przechodzi do następnej linijki. Ja chciałbym żeby ul submenu się rozciągało w szerz w zależności od zawartości li.

Z góry dziękuję za pomoc

Problem rozwiązany. Funckja CSS white-space:nowrap; załatwiła sprawę.