[css2] блочная разметка

Ales · 19.07.2005, 17:23

Имеется нехитрый код.

Проблема:
В Опере и лисице выглядит "правильно".
В ИЕ наоборот, совсем не так, как должен.
(скрины ниже)

Вопрос:
Что нужно добавить/убрать чтобы ИЕ стал послушным.
Мой опыт подгонки сайтов под браузеры подсказывает мне что я не в курсе чего-то важного в плане CSS2. Вообще как ИЕ работает с блочным форматированием?

Странности:
Под дримвейвером код выглядит так же как и под ИЕ. Чему верить?

Если у вас есть нормальный рабочий css с блочным форматированием, правильно работающий под разными версиями браузеров буду признателен получить вместо ответа

Сенкс.

Код:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">

<HTML>
  <HEAD>
    <TITLE>A frame document with CSS2</TITLE>
    <STYLE type="text/css">
      BODY { height: 8.5in } 
      #header {
        position: fixed;
        width: 100%;
        height: 15%;
        top: 0;
        right: 0;
        bottom: auto;
        left: 0;
        background-color:#33FF66;
      }
      #sidebar {
        position: fixed;
        width: 10em;
        height: auto;
        top: 15%;
        right: auto;
        bottom: 100px;
        left: 0;
        background-color:#CCCCCC;
      }
      #main {
        position: fixed;
        width: auto;
        height: auto;
        top: 15%;
        right: 0;
        bottom: 100px;
        left: 10em;
        background-color:#33CCdd;
      }
      #footer {
        position: fixed;
        width: 100%;
        height: 100px;
        top: auto;
        right: 0;
        bottom: 0;
        left: 0;
        background-color:#FF6666;
      }
    </STYLE>
  </HEAD>
  <BODY>
    <DIV id="header"> 222  </DIV>
    <DIV id="sidebar"> 333  </DIV>
    <DIV id="main"> 444  </DIV>
    <DIV id="footer">555  </DIV>
  </BODY>
</HTML>