Autor Zpráva
kelvin
Profil
Chtěl bych vertikálně vycentrovat položky v menu ( http://a.milichovsky.com/menu.html ). Nezabírá na to vertical-align: middle, nebo dělám něco špatně.

Kód je:
<style>
* {margin:0; padding: 0}
body {text-align:center}
#all { MARGIN: 0 auto; WIDTH: 778px; background: black; height:200px; position: relative;}
#menu { position: absolute; left: 0px; top: 150px; z-index: 2; width: 778px; text-align: center; background: red}
#menu ul {width: 770px; margin: 0 auto; list-style-type: none;}
#menu ul li { display: inline;}
#menu ul li a {float: left; width: 154px; background: yellow; height: 50px; }
#menu ul li a:hover {float: left; background: gray}

</style>

<body>
<div id="all">
<div id="menu">
<h3 style="DISPLAY: none">menu</h3>
<ul>
<li><a href="/">Titulní strana</a> </li>
<li><a href="/novinky">Novinky</a> </li>
<li><a href="/dokumentace">Dokumentace</a> </li>
<li><a href="/stazeni">Download</a> </li>
<li><a href="/kontakt">Kontakt</a> </li>
</ul>

</div>
</div>


Ještě se zeptám, je nějaká možnost aby jsem nemusel jednotlivým #menu ul li a udávat šířku ale roztáhly se vždy na tu zadanou šířku ul? Všechny stejně široké.
Potom by bylo jedno, kolik bude v menu odkazů.
DJ Miky
Profil
vertical-align funguje jen pro buňky tabulky. Budeš to muset odhadnout paddingem, nebo lepší řešení je nastavit stejný padding-top i -bottom. Menu pak bude mít sice dynamickou výšku, ale bude to vždy na středu. Nebo jiná možnost je line-height, ale u toho platí stejný problém jako u padding-top - při zvětšení nebo zmenšení písma to nebude vystředěné.
kelvin
Profil
DJ Miky - díky, line-height nastavený na 50px to vyřešilo.
Hlavně, že na to tu koukám v Pixyho knížce ;).
Toto téma je uzamčeno. Odpověď nelze zaslat.

0