Здравствуйте!
Такая проблема. Содержание страницы разбито на две вертикальные колонки, высота которых может быть разная в зависимости от наполнения. Есть также подвал, который всегда должен быть прилеплен к низу, если содержание страницы меньше 100% или просто располагаться ниже максимального наполнения (левого или правого), если содержание страницы превосходит окно браузера по высоте. В принципе с этой задачей справилась заданием основному блоку, содержащему левый и правый содержательные блоки, значение float: left, левой колонке внутри этого блока задала также float: left и правой - float: right, тогда при увеличении высоты внутренних блоков они могут растянуть содержащий их основной блок, так как все блоки находятся в одном потоке. Но есть один нюанс: на странице также присутствует сверху некая фиксированная всегда по высоте и расположению содержательная часть, идущая поверху страницы (логотип, инфа о погоде, банер и т.п.). Она у меня сама собой напросилась быть position: absolute. Все браузеры (Opera, FF) понимают все корректно, а IE не хочет отображать абсолютный поток, показывая только плавающие блоки основного содержания и подвал 
Такой код:
| Код |
<!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%;
}
|
|
. Почему "вроде" справилась - потому что так и не поняла толком из документации, что все это значит 