Horizontální menu

[yela94]

Zdravim, dělám si web a mám horizontální menu přes CSS, a chtěl bych udělat z jedné položky další vysouvací menu .. například když najedu na položku O Messim, aby vyskočilo další menu vertikální kde budou na výběr třeba další dvě ...

kód HTML:

<div id="menu-box">
<ul id="menu" class="clearfix">
<li class="first"><a class="active" href="index.html">Home</a></li>
<li><a href="omessim.html">O Messim</a></li>
<li><a href="klub.html">Současný klub</a></li>
<li><a href="repre.html">Reprezentace</a></li>
<li><a href="uspechy.html">Úspěchy</a></li>
<li><a href="charakteristika.html">Charakteristika</a></li>
<li><a href="osobnizivot.html">Osobní život</a></li>
</ul>


</div></div>

kód CSS

#menu-box {background: #494949;width:930px;margin: 0 auto;border-style:solid;
border-width:thin;border-radius:3px;border-color:#474040;}
#menu {width:700px; margin: 0 auto;}

#menu li {
float: left;
display: inline;
list-style-type: none;
text-align: center;
}

#menu li a {
font-size: 16px;
font-style: normal;
text-decoration: none;
color: #FFF;
margin: 0 auto;
display: inline;
line-height: 35px;
padding: 0 11px;
border-right: 1px solid #C0082A;
}

#menu li.first a {border-left: 1px solid #C0082A;}

.clearfix:after {
display: block;
clear: both;
visibility: hidden;
height: 0;
font-size: 0;
content: ' ';
}

Dík za rady

Moje menu

[d1amond]

http://www.entheosweb.com/tutorials/css ... n_menu.asp
http://www.threestyles.com/tutorials/cs ... -tutorial/

[yela94]

já si umím najít tutorialy ale potřebuju poradit jak přepsat muj kód, nevyznám se v tom moc

[d1amond]

No tak když je umíš najít, proč podle nich nejdeš?
Třeba v Tvém menu nevidím onu důležitou, druhou úroveň seznamu?

Kód: Vybrat vše

<ul>
 <li></li>
 <li>
    <ul>
      <li></li>
    <ul>
 </li>
</ul>

[yela94]

nevím jak to mám upravit abych ji tam měl

[d1amond]

Vem si jeden z těch linků co jsem poslal, napasuj to na svůj kód a uprav. Pokud nepochopíš, jak vnořit menu pomocí ul, li, tak studuj.

[yela94]

<li><a href="omessim.html">O Messim</a></li>
<li><a href=#>1</a></li>
<li><a href=#>2</a></li>

ale co mám dopsat do css?

--- Doplnění předchozího příspěvku (29 Bře 2013 23:42) ---

Vem si jeden z těch linků co jsem poslal, napasuj to na svůj kód a uprav. Pokud nepochopíš, jak vnořit menu pomocí ul, li, tak studuj.

já bych si to zvládl udělat kdybych to chtěl jako nový menu ale když to mám vložit do toho co už mám udělaný tak nevím co kam mám psát

[CZechBoY]

pokud se nevyznáš ve SVÝM kodu tak je někde problém
stáhni notepad++ a přepiš ho znova, aby ses v něm vyznal

do css jednoduše napíšeš že v rozbaleným stavu bude viditelná část menu (ul) a ve shrnutým bude neviditelná

[yela94]

já se ve svým kódu vyznám ale nevím jak a kterou část tam mám zahrnout abych měl ten výsledek kterej chci, nemůžeš mě to napsat ?

[CZechBoY]

tak můžu viď, ale pošli novej kod
je potřeba tam provést úpravu, která byla zmíněna výše d1amondem

[yela94]

teď nechápu jakou, celý csska a html jsem dal do příspěvku to nestačí ?

[CZechBoY]

no však pošli nový předělaný html podle toho co ti radil d1amnod