Snad ti to pomoze, ja mam nieco taketo. Ponuky sa vysuvaju doprava. Je to tusim tretia polozka zhora, ktora sa vysuva ,,cccc". Toto je kod css, subor s nazvom ,,rolovacie menu.css" - staci len ked si to poupravujes podla seba:
/* Kontextové CSS menu 0.5 */
/* Posledná úprava - 17.1.2017 */
body {behavior: url(csshover.htc); color: #000; background-color: #fff; font: 0.7em Arial, Verdana, lucida, sans-serif; margin: 50px;}
h1 {font-size: 200%;}
/* .tien { width: 200px; float: left; tien menu;} */
/* .tien { width: 200px; float: left; background-color: #fff;} */
.tien { width: 200px; float: left; background-color: #fff;}
.tien .menu { padding: 0; position: relative; left: -5px; top: -17px;}
/* .tien .menu { padding: 0; position: relative; left: -5px; umiestnenie podmenu;} */
/* .tien .menu { padding: 0; position: relative; left: -5px; top: -17px;} */
.obsah { margin: 0; padding: 0; background-color: #fff; border: solid 1px #9d9da1;}
.obsah ul { background: url(men.png) repeat-y top left transparent; list-style: none; padding: 2px; margin: 0; width: 100%;}
.obsah ul li { color: #aca899; padding: 0 0 1px 33px; margin:0;}
.obsah ul li a {padding: 1px 0; margin: 0;}
.obsah ul li#podmenu { background: url(sipka.png) no-repeat -1% 55% transparent;}
.obsah ul li#podmenu .tien { display: none;}
.obsah ul li#podmenu:hover {background-color: #f0f0f0;}
.obsah ul li#podmenu:hover .tien { float: left; display: block; position: absolute; left: 202px;}
.obsah ul li a { cursor: default; color: #000; width: 158px; display: block; text-decoration: none;}
.obsah ul li a:hover { background-color: #f0f0f0;}
A toto je naviazany html subor s nazvom index.htm :
<html>
<head>
<meta content="text/html; charset=windows-1250" http-equiv="Content-Type" />
<meta content="sk" http-equiv="content-language" />
<link type="text/css" href="rolovacie menu.css" media="screen,projection" rel="stylesheet" />
</head>
<body>
<div class="tien">
<div class="menu">
<div class="obsah">
<ul>
<li><a href="http://www.xxxxx.sk/xxxxx/xxxxx.htm">aaaa</a></li>
<li id="podmenu">
<a href="http://www.xxxxx.sk/xxxxx/xxxxx.htm">bbbb</a>
<div class="tien">
<div class="menu">
<div class="obsah">
<ul>
<li><a href="http://www.xxxxx.sk/xxxxx/reklama.htm">aaa</a></li>
<li><a href="http://www.xxxxx.sk/xxxxx/bannery.htm">bbby</a></li>
<li><a href="http://www.xxxxx.sk/xxxxx/reklama.htm">ccc</a></li>
<li><a href="http://www.xxxxx.sk/xxxxx/bannery.htm">ddd</a></li>
</ul>
</div>
</div>
</div>
</li>
<li id="podmenu">
<a href="http://www.xxxxx.sk/xxxxx/po.htm">cccc</a>
<div class="tien">
<div class="menu">
<div class="obsah">
<ul>
<li><a href="http://www.xxxxx.sk/xxxxx/reklama.htm">Predaj</a></li>
<li><a href="http://www.xxxxx.sk/xxxxx/bannery.htm">Služby</a></li>
<li><a href="http://www.xxxxx.sk/xxxxx/reklama.htm">Servis</a></li>
<li><a href="http://www.xxxxx.sk/xxxxx/bannery.htm">Hocičo</a></li>
</ul>
</div>
</div>
</div>
</li>
<li><a href="http://www.xxxxx.sk/kontakt/kontakt.htm">Kontakt</a></li>
<li><a href="http://www.xxxxx.sk/">O nás</a></li>
<li><a href="http://www.xxxxx.sk/">blablabla</a></li>
<li><a href="http://www.xxxxx.sk/">lalala</a></li>
<li><a href="http://www.xxxxx.sk/">Položka 8...</a></li>
<li><a href="http://www.xxxxx.sk/">Položka 9...</a></li>
<li><a href="http://www.xxxxx.sk/">Položka 10...</a></li>
</ul>
</div>
</div>
</div>
</body>
</html>