div位置不对,该怎么解决-HTML教程-爱易网页

div位置不对,该怎么解决

日期：2014-05-17　浏览次数：20788 次

div位置不对
我本意打算上边两个并排，第三个在下边
<div class="main-body">
     <div class="left">左侧部分</div>
        <div class="right">右侧部分</div>
        <div class="bot">政策法规和采购指南两个板块</div>
    </div>

div.main-body{
width:900px;
height:900px;
background:#000;
margin:0px auto;
padding:0;
}

div.left{
width:600px;
height:600px;
background:#00F;
float:left;
margin-left:0px;
}

显示的时候，第一个在距离左边的时候总是有一段距离，以至于第二个放不下，然后显示在下边去了
------解决方案--------------------



<!DOCTYPE html>

<html>

<head>

<style>

* {margin:0px;padding:0px}

#page {width:900px;background:#ccc;margin:100px auto;}

#left {width:450px;height:50px;background:blue;float:left;}

#right {width:450px;height:50px;background:red;float:left;}

#down {width:900px;background:green;height:50px;float:left;}

</style>

</head>

<body>

<div id="page">

<div id="left">left</div>

<div id="right">right</div>

<div id="down">down</div>

</div>

</body>

</html>