IE7 расстояние в пределах UL

Может ли кто-нибудь объяснить, почему IE7 настаивает на создании пространства между таблицей и ul в этом примере? Кажется, это не происходит в IE8 или FF.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<body>
    <ul style="background-color: Blue;">
        <li>
            <table cellpadding="0" cellspacing="0" border="0" width="100%" style="background-color: Red">
                <tr>
                    <td>
                        <img style="display: block" src="http://www.google.com/intl/en_ALL/images/logo.gif"
                            height="25" border="0" width="150" />
                    </td>
                </tr>
            </table>
            <ul style="background-color: Green">
                <li>One</li>
                <li>Two</li>
            </ul>
        </li>
    </ul>
</body>
</html>
3 2
css internet-explorer-7

3 ответа:

Вам нужно дать hasLayout В li, содержащий таблицу и ul.

  <ul style="background-color: Blue;">
    <li style="zoom:1;">
        <table cellpadding="0" cellspacing="0" border="0" width="100%" style="background-color: Red">
4

Все браузеры имеют разные стили по умолчанию. Некоторые из них имеют больше смысла, чем другие. Попробуйте использоватьCSS Reset для выравнивания игрового поля, так сказать.

2

Я боролся с этой проблемой с Internet explorer раньше, и это решение: удалите пробелы между тегами </td> и </tr>. Вот каким должен быть ваш html: 

</td></tr></table>

Браузер создает TextNode между </td> и </tr>, и это дополнительное пространство, которое вы видите на своей странице.

1