Autor Zpráva
Petr Havel
Profil
Zdar,
mám problém s napozicováním menu na střed. Podle dosavadních zkušeností by to jít mělo. Pokud místo <ul><li>... dám pouze text, tak se to vycentruje. Avšak menu se stále rovná doleva.
Nevíte, kde mám chybu?
Dík

HTML
<div id="navigace">
<div id="menu">
  <ul>
    <li><a href="#" >Úvod</a></li>
    <li><a href="#" >Aktuality</a></li>
    <li><a href="#" >Služby</a></li>
    <li><a href="#" >O nás</a></li>
    <li><a href="#" >Účesy a vzhled</a></li>
    <li><a href="#" >Ceník</a></li>
    <li><a href="#" >Kontakt</a></li>
  </ul>
</div>
</div>

CSS
#navigace {
    height: 55px;
    text-align: center;
    position: relative;
}
#menu {
    margin: 0 auto 0 auto;
    position: relative;
    display: inline;
}
#menu ul {
    list-style: none;
    float: left;
    display: inline;
}
#menu li{
    float: left;
}
#menu li a{
    display: block;
    padding: 7px 15px 7px 15px;
}
panther
Profil
Petr Havel:
Avšak menu se stále rovná doleva.
ano, má přeci float: left.
Petr Havel
Profil
panther:
Zkusil jsem z tagu <ul> float vyhodit a stále do dělá. U tagu <li> to vyhodit nemohu, protože se to pak chová jako seznam pod sebou
Nejde to nějak vyřešit?
panther
Profil
Petr Havel:
a stále do dělá
samozřejmě. Seznam nemá šířku = je široký tak, jako jeho floatovaný obsah. Pokud mu šířku zadáš, moc si nepomůžeš, položky budou zarovnané vlevo, díky jejich floatu.

habendorf kdysi vytvořil krásnou ukázku, prostuduj si jí.
margin
Profil *
Možnosti jsou:
- použít na menu tabulku
- deklarovat LI jako inline, nedávat jim float a odkazy nedeklarovat blokové
- deklarovat LI a odkazy jako inline-block, nemá podporu ve starších IE
- http://pokusy.1-webdesign.cz/centrovany-float.html (habendorfo řešení)
- http://dero.name/stuff/centrovani_bloku.html
Petr Havel
Profil
margin:
Děkuji, už to jde
Jen pro pochopení: Jakým způsobem se tag chová, když se mu dá display table či table-cell?
panther
Profil
Petr Havel:
Jakým způsobem se tag chová, když se mu dá display table či table-cell?
jako tabulka, resp. její buňka. Ale nefunguje všude, opatrně s tím.
Kubo2
Profil
Musím podotknúť, že ak by si to menu obalil do tagu <center>, tak by to ostalo zafixované v strede, na 100% a už by to dolava vůbec nešlo nastylovat.

Já sám sem před pár dny udělal to, že jsem celú stránku obalil do <center>, potom jsem na to zapomněl, a sťažoval jsem se tu v diskusi ( Nejde nastylovat dolava ), že mi to nejde nastylovat dolava.
:D


A prosím, aby mi to moderátoři nemazali, nakolik vím, že to už jde, no chtěl jsem tuto diskusi obohatit o můji skušenost.
jenikkozak
Profil
Kubo2:
Musím podotknúť
Nemusíš.

na 100% a už by to dolava vůbec nešlo nastylovat.
Opravdu ne? Já bych řekl, že to vlevo nastylovat jde poměrně snadno. (A to i bez toho, abych tu šermoval s vymyšlenými procenty úspěšnosti.)

<style>center{text-align:left}</style>
<center>Text vlevo</center>
margin
Profil *
Kubo2:
ak by si to menu obalil do tagu <center>, tak by to ostalo zafixované v strede, na 100%
Aniž bych to zkusil, tak mi bylo jasné, že to nebude fungovat, komu to není na 100 % jasné, může se přesvědčit: http://jsfiddle.net/b5rW3/

I kdybys úplně na <center> zapomenul, tak jde text zarovnat doleva:
<style>
p {text-align: left;}
</style>

<center>
  <p>Lorem ipsum</p>
</center>
Ugo
Profil
margin:
to co máš v ukázce samozřejmě není správně, resp. je to logicky, div se roztáhne přes celou plochu, tudíž je na středu, ale jeho obsah již ne, musel bys obalit samotný prvek jenž má menší šířku, není to ekvivalent k text-align, ale spíš k width:500px; margin:auto;
jenikkozak
Profil
Ugo:
Ale už to není 100% zafixované na středu, což tvrdil Kubo2. Pokud máš objekt široký 100%, nezáleží na tom, jestli je umístěný vlevo, vpravo, nebo na střed, stejně bude přes celou šířku.

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm:

0