Živé HTML fosílie 5 - WBR

Aktualizace 2010: tag WBR se dostal do specifikace HTML 5, takže ho doporučuji běžně používat.

Zastaralý HTML tag <wbr> umožňuje zalomit řádek na libovolném místě dokumentu bez toho, aby tam končilo slovo. Funguje to ve všech verzích Exploreru a v Mozille (a v Chrome, pozn. 2006).

Zpracování dlouhých HTML odstavců v prohlížeči funguje tak, že když text dojede na konec řádku, tak se řádek automaticky zalomí a pokračuje se na řádku dalším. To zalomení se může odehrát na konci slova, to jest tam, kde je v HTML zdroji mezera nebo některá interpunkční znaménka (-?!()[]{}°%). Existují ale některé řídké případy, kdy k rozdělení dlouhého slova mezeru nelze použít (například pokud vypisuju URL), protože na místě potenciálního rozdělení prostě nesmí být nic. Pak se hodí použít wbr:

rozdě<wbr>litelné slovo

Velmi podobně jako tag <wbr> funguje html entita &shy;. Ta také dovoluje zalomit dlouhé slovo, ale na konec prvního řádku viditelně přidává rozdělovník (vlastně spojovník). Pokud slovo není potřeba dělit, slovo se nerozdělí a entitu není vidět. Entita &shy; nefunguje v Mozille (a patrně i v dalších prohlížečích odvozených od Gecka).

Pár živých příkladů:

VelicedlouhéslovoBezRozdělováníVelicedlouhéslovoBezRozdělování

VelicedlouhéslovoRozdělenéEntitouShy­VelicedlouhéslovoRozdělenéEntitouShy­VelicedlouhéslovoRozdělenéEntitouShy

VelicedlouhéslovoRozdělenéTagemWBRVelicedlouhéslovoRozdělenéTagemWBRVelicedlouhéslovoRozdělenéTagemWBR

VelicedlouhéslovoUmístěnéVExplorerříSpecialitěWordBreakVelicedlouhéslovoUmístěnéVExplorerříSpecialitěWordBreak

Kombinace wbr a shy

Pokud mám tedy nějaké dlouhé slovo, které nemohu rozdělit mezerou, ale potřebuju ho zalomit ve všech moderních browserech, použiju kombinaci &shy;<wbr>

VelicedlouhéslovoRozdělenéWBRaShy­VelicedlouhéslovoRozdělenéWBRaShy­VelicedlouhéslovoRozdělenéWBRaShy

Tag WBR se považuje za zavržený už hodně dlouho. Nemohu říci, že bych jej zcela doporučoval, ale na dělení příliš dlouhých slov se hodí.

CSS vlastnost word-break

Pro Explorer existuje nestandardní vlastnost word-break s hodnotami normal, keep-all a break-all. Na zalamování celých textů se hodnota break-all vůbec nehodí, protože to láme hlava nehlava i mimo konce slov (určeno tuším pro korejštinu). Pokud ale do takto ostylovaného tagu span umístíte pouze nějaké dlouhé slovo, zalomí se na více řádků podle potřeby. Také nemůžu říci, že bych to doporučoval používat, ale je dobré vědět, že to existuje.

Aktualizace: Mormegil v komentářích zmínil existenci entity &#8203;, která se chová přesně stejně jako tag <wbr>, akorát je podporovaná i v Opeře. Říká se jí Zero width space a dodnes jsem ji neznal. Výborně, můžu tedy ze svého arzenálu možná vypustit další zastaralý tag. (Někomu se ale prý na místě entity zobrazuje čtvereček.)

VelicedlouhéslovoRozdělenéEntitou#8203​VelicedlouhéslovoRozdělenéEntitou#8203​VelicedlouhéslovoRozdělenéEntitou#8203

Problém s entitou &shy; je v Safari. Tento Macovský prohlížeč zřejmě vykresluje entitu vždy jako pomlčku, i když se řádek neláme.

Publikováno 24. listopadu 2004

Článek je původně z weblogu

 

Reklama

www.webhosting-c4.cz, webhosting s doménou v ceně. 20GB
o tvorbě, údržbě a zlepšování internetových stránek

Návody HTML CSS JavaScript Články Ostatní

Články Katalog zdrojů SEM SEO

Jak psát web píše Yuhů, Dušan Janovský. Kontakt.