čtvrtek 12. května 2011

Rozdílné řádkování line-height v prohlížečích

To, že se vykreslení (renderování) webové stránky v jednotlivých prohlížečích liší, je známá věc. Dříve byly rozdíly hodně velké, dnes ale, díky většímu respektu programátorů i kodérů k webovým standardům, je situace mnohem lepší, a v ideálním případě nemusíte sahat k různým berličkám a hackům, aby stránky vypadali identicky. Drobné rozdíly se většinou promíjejí. Když ale narazíte na klienta, kterému vadí i rozdíl 1 px, máte o zábavu postaráno:

Stránce jsem nadefinoval řádkování globálně pomocí line-height na 130 %. Firefox 4 pak vypočte řádkování jako 15,5833 px, Intenet Explorer 8 jako 16 px (zaokrouhlí myslím matematicky) a Opera a Chrome jako 15 px (ořeže desetiny). Nepomůže ani line-height nastavit v jiné jednotce nebo přímo v desetinách px - desetinky nic než Firefox nevezme. Přitom zrovna řádkování ve Firefoxu vypadalo nejlépe - přitom tak nedosažitelné...

Po chvíli rozmýšlení jsem nakonec nastavil line-height na 134%, kdy Opera, Chrome i Intenet Explorer vypočtou 16 px a Firefox 4 16,067 px. Hádat se o 0,067 px se snad už nebude nikdo ;-)

MAKE Magazine

Technology Review RSS Feeds

Nejčtenější příspěvky