VPF::потоки в IE - Форум программистов

yalo

Дата 22.5.2007, 08:02 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 210
Регистрация: 24.5.2006

Репутация: нет
Всего: 2

Здравствуйте!

Такая проблема. Содержание страницы разбито на две вертикальные колонки, высота которых может быть разная в зависимости от наполнения. Есть также подвал, который всегда должен быть прилеплен к низу, если содержание страницы меньше 100% или просто располагаться ниже максимального наполнения (левого или правого), если содержание страницы превосходит окно браузера по высоте. В принципе с этой задачей справилась заданием основному блоку, содержащему левый и правый содержательные блоки, значение float: left, левой колонке внутри этого блока задала также float: left и правой - float: right, тогда при увеличении высоты внутренних блоков они могут растянуть содержащий их основной блок, так как все блоки находятся в одном потоке. Но есть один нюанс: на странице также присутствует сверху некая фиксированная всегда по высоте и расположению содержательная часть, идущая поверху страницы (логотип, инфа о погоде, банер и т.п.). Она у меня сама собой напросилась быть position: absolute. Все браузеры (Opera, FF) понимают все корректно, а IE не хочет отображать абсолютный поток, показывая только плавающие блоки основного содержания и подвал smile

Такой код:

Код


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>тайтл</title>
<link rel="stylesheet" type="text/css" href="float.css" />

</head>

<body>

    <div id="content">
        <div>
            <div id="left_cont">content1</div>
            <div id="right_cont">content2</div></div>
        <div id="garant"></div>
    </div>

    <div id="footer">
        <div id="downfootline">podval</div>
    </div>

    <div id="simple"></div>

</body>
</html>

такой css-код

Код


    html {
      height:100%;
      background: #98CDC9;
      margin: 0px;
      padding: 0px;
      border: 0px solid #0f0;
    }

    body {
      padding:0px;
      min-width: 1003px;
      min-height:100%;
      height:100%;
      margin: 0px;
      border: 0px solid #0f0;
      background: #98CDC9;
      font: 8pt/10pt Tahoma, Arial, sans-serif;
      color: #171717;
    }

    * html body {
      height:100%;
      width: 100%;
      }

      #simple{
        background: #6633CC;
        width: 500px;
        height: 500px;
        position: absolute;
        top: 70px;
        left: 30px;
      }
    #content {
      position: relative;
      float: left;
      min-height: 100%;
      margin-bottom: -29px;
      border: #FF00FF 0px solid;
      background: #98CDC9;
      width: auto;
    }

    #left_cont {
      height: 200px;
      width: 100px;
      float: left;
      background: #66CC33;
    }

    #right_cont {
      height: 1200px;
      width: 300px;
      float: right;
      background: #FF9966;
    }


    * html #content {
      height: 100%;
    }

    #footer {
      position: relative;
      float: left;
      height: 29px;
      background: #EFEDE5;
      min-width: 1003px;
      width: 100%;
    }

    #garant {
      height: 29px;
      margin: 0px;
      padding: 0px;
    }

    * html #upfootline {
      width: 100%;
    }

#downfootline {
  background: #EFEDE5;
  height: 29px;
  min-width: 1003px;
  width: 100%;
  text-align: center;
  font:  7pt/10pt Tahoma, Arial, sans-serif normal;
  color: #171717;
}

* html #downfootline {
  width: 100%;
}

yalo

Дата 22.5.2007, 10:19 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 210
Регистрация: 24.5.2006

Репутация: нет
Всего: 2

вроде справилась с задачей, наобум попробовала применить к абсолютному блоку #simple значение clear: both или clear: left... В итоге блок проявил себя и в експлорере наконец-то smile

. Почему "вроде" справилась - потому что так и не поняла толком из документации, что все это значит smile

уж больно мудрено там все это описывается про свойство clear, видимо придется доходить до всего как всегда при помощи интуиции и практики, или может кто-то все-таки объяснить грамотно решение моей задачи, и вообще решила ли я ее? ведь, не поняв что я сделала, может все-таки вылезть в дальнейшем косяк какой-нить в верстке из-за неполного ее понимания

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| Вёрстка веб-сайтов \| Следующая тема »