Á igen, a régóta várt IE7, ami talán megváltás lehet a HTML és CSS buheráló társadalom számára. Vagyis hát megváltás lehetett volna. Nem panaszkodom, az eddigi 39 soros külön az IE számára fenntartott CSS fájlom mérete 9 sorra csökkent (vagyis, az eddigi 39 soros mellé még egy 9 sorosat is kellett gyártanom, csak az IE7 számára, de az a 9 sor a 39 sorosban is szerepel), viszont cserébe most olyan dolgok nem működnek, amik eddig mentek rendesen (mint például a főoldalon a három oszlopos listának nincs háttere IE7 alatt, vagy a hozzászólásokban a szöveg ugyanolyan széles marad miután az avatar doboz már nincs ott). Gyanítom, hogy csak azért csinálják ezt, hogy ne unatkozzunk. A kinézet helyenként nem rossz, a fülek mondjuk kifejezetten nem tetszenek, de az Alt-ra előjövő menü viszont ötletes megoldás.

<div class="valami">Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</div>
<div class="valami">Lorem ipsum <em>dolor sit amet</em>, consectetuer adipiscing elit.</div>

Mint az látható, nem is kell feltétlen az egész bekezdésnek dőltnek lennie, elég ha egy sor vége és a következő sor eleje az.

.valami {
	width: 150px;
	background: #DDD;
	color: #777;
	text-align: justify;
	margin: 2px 0;
}

A másik fontos dolog a text-align: justify; sor, szimpla balra vagy jobbra igazítás mellett semmi gond nincs a dőlt betűkkel. Itt pedig egy kép is látható, hogy ennek a dolognak hogy kellene kinéznie (van egy 10px-es padding is, amit a kódból kihagytam, mert nem befolyásolja a dolog működését).
Természetesen az IE máshogy értelmezi a világot, és valami úton módon a második bekezdés 4px-el szélesebbre sikerül neki, mint ami elfogadható lenne.

Megoldás? Szerencsére az is akad, akár több is. Választhatjuk azt, hogy az IE számára másfajta szabályokat adunk az <i> és az <em> tageknek, hogy ne legyenek dőltek. Csinálhatjuk azt, hogy a sorkizárt bekezdések IE-ben balra legyenek igazítva. Ha viszont minden áron dőlt betűstílust akarunk használni sorkizárt bekezdésben, akkor ez a kis kibővítés megoldja a problémánkat, amire itt leltem rá:

.valami {
	width: 150px;
	background: #DDD;
	color: #777;
	text-align: justify;
	margin: 2px 0;

	overflow: visible;
	height: 1em;
}

Természetesen a normális böngészők nem szeretik látni ezt a két sort, tehát úgy használjuk, hogy ők ne lássák, vagy számukra felül legyen definiálva (IE feltételes megjegyzések, !important, stb.). Remélem sikerült megspórolnom az érintettek számára pár percnyi bugvadászatot.