Вернулся почти к томуже от чего уходил, только теперь слои меню и содержания не вылазят за родительское окно, в опере осле и фоксе отображается одинаково, но немогу сделать чтобы слои меню и содержания зависели друг от друга, т.е если один слой высотой 600 px то и второй должен быть такимже. Вот код:
CODE:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<style type="text/css" media="screen">
#m {
width: 880px;
border-top: 1px solid #000000;
border-right: 1px solid #000000;
border-left: 1px solid #000000;
border-bottom: 1px solid #000000;
background: #E7EAF5;
padding-top: 2px;
padding-left: 2px;
padding-right: 2px;
padding-bottom: 2px;
}
#g {
width: 870;
height: 10px;
font-size: 0px;
line-height: 0px;
border: 1px solid #000000;
}
#w {
background: url(background.gif) repeat-y right;
}
#h {
height: 80px;
border-right: 1px solid #000000;
border-left: 1px solid #000000;
}
#c {
width: 100%;
height: 100%px;
background: url(background.gif) repeat-y right;
float: right;
margin-left: -200px;
}
#co {
margin-left: 200px;
margin-top: 2px;
margin-bottom: 2px;
border-left: 1px solid #000000;
border-right: 1px solid #000000;
border-top: 1px solid #000000;
border-bottom: 1px solid #000000;
font-family: Tahoma;
font-size: 11px;
color: #16285C;
}
#s {
width: 196px;
height: 600px;
float: left;
border-left: 1px solid #000000;
border-right: 1px solid #000000;
border-top: 1px solid #000000;
border-bottom: 1px solid #000000;
margin-top: 2px;
margin-bottom: 2px;
margin-right: 2px;
font-family: Tahoma;
font-size: 11px;
color: #16285C;
}
#l {
width: 200px;
float: left;
height: 80px;
margin-left: 5px;
}
#b {
width: 468px;
height: 60px;
border-top: 1px solid #000000;
border-right: 1px solid #000000;
border-left: 1px solid #000000;
border-bottom: 1px solid #000000;
float: left;
margin-left: 100px;
margin-top: 10px;
font-family: Tahoma;
font-size: 11px;
color: #16285C;
}
#f {
border-left: 1px solid #000000;
border-right: 1px solid #000000;
border-top: 1px solid #000000;
border-bottom: 1px solid #000000;
font-family: Tahoma;
font-size: 11px;
color: #16285C;
}
.c {
height: 0;
clear: both;
font-size: 0px;
line-height: 0px;
}
</style>
</head>
<body topmargin="0" bottommargin="0" leftmargin="0" rightmargin="0">
<div align="center">
<div id="m">
<div id="g"></div>
<div id="h">
<div id="l"></div>
<div id="b">Banner 468 x 60 px</div>
</div>
<div id="g">
<div align="right">
</div>
</div>
<div id="w">
<div id="c">
<div id="co">
<h1>content</h1>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus varius eleifend tellus. Suspendisse potenti. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Nulla facilisi. Sed wisi lectus, placerat nec, mollis quis, posuere eget, arcu.</p>
Donec euismod. Praesent mauris mi, adipiscing non, mollis eget, adipiscing ac, erat. Integer nonummy mauris sit amet metus. In adipiscing, ligula ultrices dictum vehicula, eros turpis lacinia libero, sed aliquet urna diam sed tellus. Etiam semper sapien eget metus.
</div>
</div>
<div id="s">
<h1>sidebar</h1>
<ul>
<li>link one</li>
<li>link two</li>
</ul>
</div>
<div class="c"> </div>
</div>
<div id="f">footer</div>
</div>
</div>
</body>
</html> |