Помогите разобраться со слоями

Sand · July 26, 2008

Привет! Начал разбираться с версткой дивами...сверстал нечто..) в IE7 все отображается как мне надо...то есть вверху блок top, в центре контейнер center с двумя блоками, расположенными слева и справа соответственно......в FF отображается не так как мне надо...помогите, пожалуйста, найти ошибку в стилях

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>test</title>


<style>
#top{
background-color:#009900;
width:95%;
margin: 0 auto;
}

#center{
background-color:#cccccc;
width:95%;
margin: 0 auto;
margin-top:5px;
}

#centerLeft{
background-color:#FF9900;
width:200px;
float:left;
margin: 20px;
}


#centerRight{
background-color:#FF0000;
width:600px;
float:leftt;
margin: 20px;
}



#bottom{
background-color:#EEEEEE;
clear:both;
width:95%;
margin: 0 auto;
margin-top:5px;
}


body,td,th {
	font-family: Tahoma;
	color: #000000;
	font-size: 12px;
}
body {
	margin-left: 0px;
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 0px;
}
</style>






</head>

<body>
<div id="top">
  <p>top</p>
</div>


<div id="center">



<div id="centerLeft">left</div>
<div id="centerRight">
  <p>right</p>
  <p></p>
  <p></p>
</div>


</div>

<div id="bottom"><div style="height:40px;">bottom</div></div>
</body>
</html>

Furius · August 1, 2008

я бы это сделал так

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>test</title>


<style>
body {
margin:0 0 0 0;
padding:0 0 0 0;
}
#contain {
margin: 0 auto;
width:1000px;
}
#top {
height:30px;
background:#ccc;
}
#left {
float:left;
width:200px;
background:red;
}
#center {
width:600px;
float:left;
}
#right {
float:right;
background:blue;
width:200px;
}
#foot {
width:1000px;
background:#006;
clear:both;
height:20px;
}
</style>
</head>

<body>
<div id="contain">
	<div id="top">top</div>
	<div id="left">left</div>
	<div id="center">center</div>
	<div id="right">right</div>
	<div id="foot">foot</div>
</div>
</body>
</html>

Sign In

Помогите разобраться со слоями

Question

Sand

Link to comment

Share on other sites

1 answer to this question

Recommended Posts

Furius

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information