День добрый. Помогите пожалуйста разобраться со следющей проблемой:
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
71.
72.
73.
74.
75.
76.
77.
78.
79.
80.
81.
82.
83.
84.
85.
86.
87.
88.
<!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" lang="en" xml:lang="ru">
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1251" />
<title>трехколонный макет, футер снизу</title>
<style type="text/css">
html, body { margin: 0 ; padding: 0 ; height: 100 %; width: 100 %; }
#main {
height: auto !important;
height: 100 %;
min-height: 100 %;
margin: 0 auto;
background: # 999 url(bg-left.gif) repeat-y left;
width: 100 %;
min-width: 800px;
width: expression(((document.documentElement.clientWidth || document.body.clientWidth) < 800 )? "800px" : "100%");
}
#header {
background: #cda;
height: 100px;
margin: 0 auto -100px;
position: relative;
}
#footer {
background: #cad;
height: 70px;
margin: -70px auto 0 ;
clear: both;
}
#columns {
padding: 100px 0 70px 0 ;
overflow: hidden;
width: 100 %;
}
#wrap {
float: left; width: 100 %; margin-right: -240px;
background: # 999 url(bg-right.gif) repeat-y right;
}
#container {
margin-right: 240px;
height: 100 %;
background: # 999 url(bg-left.gif) repeat-y left;
}
#left { float: left; width: 240px; background-color: #b0dbf2; }
#right { float: right; width: 240px; background-color: #abb3f8; }
#content { margin-left: 240px; background-color: # 999 ; }
</style>
</head>
<body>
<div id="header">header</div>
<div id="main">
<div id="columns">
<div id="wrap">
<div id="container">
<div id="left">
left left left left left
</div>
<div id="content">
<table >
<tr>
<td>wqrqwr</td>
<td>sfgsdf_wqq</td>
<td>wqrqwr</td>
<td>sfgsdf_wqq</td>
<td>wqrqwr</td>
<td>sfgsdf_wqq</td>
<td>wqrqwr</td>
<td>sfgsdf_wqq</td>
<td>wqrqwr</td>
<td>sfgsdf_wqq</td>
</tr>
</table>
</div>
</div>
</div>
<div id="right">
right right right
</div>
</div>
</div>
<div id="footer">
footer footer footer footer footer
</div>
</body>
</html>
Когда уменьшаю ширину экрана в IE6 до того, пока таблица не поместится в экран, весь контент спрыгивает вниз и позиционируется по высоте ниже левого меню (<div id="left">). Как с этим бороться? в FF, Опере все нормально. А то я уже не знаю что и делать. Заранее благодарю.
