A mai nap szántam egy kis időt arra, hogy az Internet Explorer egyik érdekes viselkedésmódját tanulmányozzam. A végére viszont elakadtam, elkelne egy kis segítség...
Adott két nagyon egyszerű HTML kódocska, melyek egyetlen karakterben különböznek egymástól.
Megjelenítésük mégis kicsit "furcsán" történik IE7 alatt. (A többi verziót nem próbáltam, valójában nem is érdekel, inkább csak a probléma izgat.)
Lássuk:Első oldal
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="hu" lang="hu">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<table cellpadding="0" cellspacing="0" border="0" align="center" width="100%">
<tr>
<td colspan="3" bgcolor="pink">12345678901234567</td>
<td bgcolor="blue"></td>
</tr>
<tr>
<td width="100" bgcolor="yellow">100</td>
<td bgcolor="magenta">auto</td>
<td width="12" bgcolor="green">12</td>
<td width="100" bgcolor="red">100</td>
</tr>
</table>
</body>
</html>
Saját böngésződben megtekintheted, ha ide kattintasz: 1.html.
Az oldal az általam ismert összes böngészőben helyesen jelenik meg, valahogyan így:
Második oldal
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="hu" lang="hu">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<table cellpadding="0" cellspacing="0" border="0" align="center" width="100%">
<tr>
<td colspan="3" bgcolor="pink">123456789012345678</td>
<td bgcolor="blue"></td>
</tr>
<tr>
<td width="100" bgcolor="yellow">100</td>
<td bgcolor="magenta">auto</td>
<td width="12" bgcolor="green">12</td>
<td width="100" bgcolor="red">100</td>
</tr>
</table>
</body>
</html>
Az egyetlen karakter különbséget piros színnel jelöltem.
Saját böngésződben megtekintheted, ha ide kattintasz: 2.html.
IE7 alatt az oldal megjelenítése kissé érdekes: a pixelben megadott táblázatcella-szélességek kalkulálása nem sikerül tökéletesen.
A második sor harmadik cellája szemmel láthatóan nem 12 pixel széles.
Mint látható, az egyes cellákban feltüntettem azt a hosszt, amit szélességben meg (kellene) határoznia a HTML kódnak.
És mindezt az okozza, hogy a táblázat első sorának első cellájának tartalmát, vagyis a megjelenítendő szövegrészt 17 karakterről 18 karakter hosszúra bővítettem.
Van erre magyarázat?
*** UPDATE ***
Többek javaslatára módosítottam a kódot, a 'with' attribútum helyett CSS-ben határozom meg a cellák szélességét:
1css.html
2css.html
De az IE7 megjelenítésén ez mit sem változtat...
*** UPDATE2 ***
Valid XHTML változat:
http://cpu.hu/2css.html