| Autor | Zpráva | ||
|---|---|---|---|
| quatzael Profil |
Mám vedle sebe několik divů, s třídou inline. Když jsou prázdné, tak jsou umístěny normálně v linii. Když do nich vložím text, tak se celý div posune dolů až po text, který je na úrovni spodní části vedlejších divů.
Pozn. Tuhle skupinu divů mám v jiném obalovém divu, který je taky inline, ale to myslím nemá vliv.. Ilustrační obrázek: 
.inline
{
height: 48px;
width: 140px;
background-image: url('/png/pic.png');
background-repeat: no-repeat;
display: inline-block;
*zoom: 1;
*display: inline;
} |
||
| juriad Profil |
Chová se to stejně ve všech prohlížečích? (Vidím tam snahu o hacky pro starší IE.)
Dodej živou ukázku. Nerozumím jak může mít prázdný div.inline nějakou šířku. -> Vsadím se, že před chvílí tam ještě ta šírka nebyla. :-) |
||
| quatzael Profil |
juriad:
„Chová se to stejně ve všech prohlížečích?“ Ve všech. „nerozumím jak může mít prázdný div.inline nějakou šířku.“ Je tam přece nastaveno width: 140px; takže může..
juriad: „Dodej živou ukázku“ http://kod.djpw.cz/ycfb |
||
| Trejpa Profil |
#4 · Zasláno: 22. 8. 2014, 16:15:35
quatzael:
Je to vertikálním zarovnáním inline-block prvků. Neuskočí ten s textem dolů, ale naopak ty bez textu nahoru. Výchozí hodnota je totiž nutí srovnat spodní okraj elementu s linkou pro písmo. Jediné písmo na daném řádku je v dalším inlene-block elementu, ale to je u jeho vrcholu. Proto jsou právě na tom místě. Kdyby měly všechny textový obsah, tak tuhle zvláštnost nepozoruješ. Přidej si do stylu vertical-align: middle;
ukázka |
||
| quatzael Profil |
Trejpa:
Jojo, to funguje. Díky! Taky mě to napadlo s tím vertical-align, ale myslel jsem, že to funguje jenom na table-cells. juriad: -> Vsadím se, že před chvílí tam ještě ta šírka nebyla. :-) Možná jsem to tady pak ještě dopsal, ale u mě byla už od začátku:o) |
||
| juriad Profil |
quatzael:
Nebo přidej text dovnitř těch prázdných divů (například: )
|
||
| Bubák Profil |
#7 · Zasláno: 22. 8. 2014, 17:15:32
juriad:
Babicovat HTML? |
||
|
Časová prodleva: 10 let
|
|||
0