Autor Zpráva
snazimse
Profil
Zdravím,

mám takový triviální problém,
ale nějak mi to prostě nedocvaklo.
Jak zarovnat něco co je uprostřed třeba vertikálně.
Vertikální je přece svisle,takže od zhora dolů? Ale co to jako v praxi znamená,
zarovnat vertikálně?

Když to mám uprostřed třeba nějaký text,nebo obrázek,kam to mám zarovnat,nahoru ,nebo dolů?
Nebo nikam,jen tam nemají být žádné mezery? Nějak to nechápu. Jako asi je zřejmé,že to má tvořit svislici s něčím jen nechápu zda nahoru dolů,s mezerou nebo bez?

Díky všem za objasnění!
anonymníí
Profil *
snazimse:
V CSS je to s vertikálním zarovnáním trochu složitější než s horinzontálním, ale zdá se mi, že vůbec nechápeš (obecně), co to to vertikální centrování je. Takže, zkusím to vysvětlit spíš tak, než sem dávat nějaké CSS.

Představ si, že máš blok vysoký 300px.
Dále máš objekt s výškou 150px.
Objekt potřebuješ umísitit do vnějšího bloku, a to tak, aby byl vertikálně vycentrovaný. V praxi to znamená, že:
- pokud by byl stejně vysoký jako obal, bude zabírat celou jeho výšku a bude to vypadat stejně, jako bychom ho necentrovali (zarovnání nahoru = zarovnání na střed = zarovnání dolů)
- pokud bude nižší, což je případ, který jsem uvedl, bude mít nahoře a dole stejný rozestup, konkrétně ((300-150)/2)px.
Taurus
Profil
Pokud chápeš horizontální zarovnání, tak chápeš i vertikální, protože stačí si to horizontální chápání otočit o 90°.
snazimse
Profil
No já mám pravě to mít zarovnáno jen vertikálně.

Kdyby tam bylo vertikálně na střed,tak chápu,ale je napsáno jen vertikálně,a to automaticky znamená na střed? Když to není stejně vysoké?

Díky
anonymníí
Profil *
snazimse:
ale je napsáno jen vertikálně
... kdo to napsal? Zeptej se jeho, co tím myslel. Můžeme jen spekulovat.
snazimse
Profil
No myslel právě to centrování,ale já jsem to nepochopil.

Díky za vysvětlení!
bestik_63
Profil
ahoj,
vertikálně jde zarovnávat pokud blok nastyluješ jako tabulku (display:table) a pak jde použít vertikální zarovnání (vertical-align: middle)
více na Vertikální centrování v CSS

ale je to věda a ne vždy to funguje (záleží na jaký prvek to používáš)

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: