span

Mám problém na adrese:

http://avar.borec.cz/test/pokus.html

ty náhledy jsou ve spanech a já potřebuju, aby se náhled, jméno autora a velikost obrázku, zobrazovali vždycky pod sebou. Dal jsem tam tag <br /> a v mozzile je to celé rozhašené. V IE i Opeře bez problémů. Jak na to? Díky za pomoc. Stip

spanu nastavit display:block ?

To nepomáhá. Ten text se zarovnává stále za obrázkem nikoliv pod něj. Stále ale nechápu jak je možné, že se spany zobrazí nad sebou pokud použiju <br /> uvnitř samotného spanu. To je přece nesmysl. Odrazit na nový řádek by to mělo pokud bude <br /> před spanem a ne uvnitř spanu.

na stránce jakpsatweb.cz se praví následující:

"Řádkový element span v sobě nemůže obsahovat blokové elementy."

a naopak:

"<div> by se neměl vyskytovat v řádkovém elementu."

Jinými slovy to o co se pokouším, není v současném CSS řešitelné. Musí se to udělat jedině tabulkou. To je teda dost na pytel a je to rána do vazu všem odpůrcům tabulkových layoutů a zastáncům "moderního divování". Samozřejmě by to šlo udělat pomocí dvou divů a v každém po jednom řádku spanů. To se ale při zmenšování okna rozjede a popisek k obrázku tak ztratí svoji souvislost.

No moment, tady máš hned dva důkazy toho, že to jde velice elegantně:

http://sovavsiti.cz/c02041.html

Děkuji, přiznám se že tomu mojemu předešlému komentáři jsem předem nevěřil. Použil jsem účelově silná slova, abych co možná nejdříve vyprovokoval jejich vyvrácení.

Jinak hlavní problém byl, moje neschopnost poskládat divy pomocí float: left za sebou a nikoli pod sebou. Držel jsem se stále spanu a to je k ničemu.

Jinak ale stále nerozumím chování spanu s <br /> uvnitř. Proč najednou začne odrážet celý, stejně jako by <br /> bylo před ním.

podle mě hlavně nemůžeš uvnitř spanu použít <br />, protože span je element jednořádkový a tím <br /> v něm vlastně vyváříš další řádek...ale možná to chápu špatně

Asi to chápeš správně. Jde ale o to jestli je <br /> silnější než <span> nebo ne.

Jinak by mě ještě zajímalo, jestli to v tom příkladu na http://sovavsiti.cz/c02041.html jde udělat tak aby obsah jednotlivých divů byl vertikálně zarovnán ke spodku (obdoba valign="bottom").

<br> je blokovy element s vyskou jednoho radku (aspon si to tak dokazu predstavit)

Pokud to chceš srovnat na spodek, nejspíš by šlo nastavit nadřazenému prvku position:relative a v něm to absolutně pozicovat vlastností bottom.

<br /> imho zrovna dvakrát blokový element není, to by nevalidoval uvnitř spanu, a on validuje.

Span není "jednořádkový element", ale řádkový element. Když je dlouhý, zabere tolik řádků, kolik potřebuje, a skončí třeba v půlce třetího. Kdyby to byl třeba div (blokový element) se stejným obsahem, zabral by si ty tři řádky celé.

> "Jinak ale stále nerozumím chování spanu s <br /> uvnitř. Proč najednou začne odrážet celý, stejně jako by <br /> bylo před ním."
...přiznávám, že tady jsem nějak nestihla, k čemu se tohle tvrzení váže. Zkusila jsem si napsat takový malý příklad, a ten span před sebou nic neodlamuje v IE6, Mozille ani Opeře:

<div>
textík textík
<span style="background:red;">text<br/>lorem ipsum</span>
textík textík
</div>

Nezobrazilo se ti to pod sebou třeba proto, že jsi tam něčemu nastavil display:block?

btw, kdyby byl <br> blokový element o výšce jednoho řádku, byl by jeho optický efekt velmi podobný tomu, co dělá <p>.
<br> ten řádek jenom zalomí a nedělá žádné horní ani dolní mezery.

no vidis, to je fakt

Já se v takových případech dívám přímo do dtd. A i podle strict11.dtd může span obsahovat br. Takže tak. Teď je otázka, co to má dělat a jestli se náhodou mozilla nechová jediná správně. Když dám na řádku br tak předpokládám, že se další text objeví na dalším řádku a když následuje řádkový element, tak by fakt měl být na novém řádku. Ne? Nechci Mozillu nějak obhajovat, jenom mě to napadlo.

Počkejte, o jakém (ne)správném chování Mozilly u spanu se to bavíme? Zrovna v tomhle nepozoruju mezi prohlížeči žádné rozdíly, viz. můj předchozí příspěvek...

..aha.. sorry, v 16.15 už jsem prací poměrně vyčerpaný, tak nějaké skvělé myšlenkové pochody....