Question

Dreamweaver div左右布局

<div>
<div>如何在左边？</div>
div>如何在右边？</div>
</div>
一个DIV欠套二个DIV在里面，如何让里面的这2个DIV一个放在左边，一个防在右边？可以留20PX的空隙

Answer 1

html代码：

<div class="bigBox clearfix">
    <div class="left">如何在左边？</div>
    <div class="right">如何在右边？</div>
</div>
<div class="clear"></div>

css代码：

.bigBox {margin: 0 auto; width: 960px;}
.left { float: left; width: 600px;}
.right { float: right; width: 340px;}
/* clearfix */
* html .clearfix {zoom: 1;}
*+html .clearfix {zoom: 1;}
.clearfix:after{ content:"."; display:block; height:0; clear:both; visibility:hidden;}

解释：bigBox上加clearfix是为了能让bigBox容器撑开，这个你写背景的时候就知道了，还有浮动的元素最好加上宽度

追加：如果一个div里面有俩个元素（一个（左）没浮动，一个（右）有浮动），浮动的元素要先写，就是（一个（右）有浮动，一个（左）没浮动），如果不这么写，ie7（好像是这个）会产生错位；

还有就是清除浮动的元素，是你用浮动元素的父级的第一个兄弟元素(这里面的clear)清除，直接

.clear { clear: both;}

Answer 2

在他们说的这些基础上面，还有一点很重要

当你给div设置浮动的时候，记得要清除浮动，清除浮动的目的就是为了不让它的浮动对下面造成影响。。

<div style="width:400px;">
<div style="float:left; width:180px; height:100px;border:1px solid #c00 ;">如何在左边？</div>
<div style="float:right; width:200px; height:100px; border:1px solid #00f;">如何在右边？</div>
<div style="clear:both"></div>
</div>

Answer 3

给你做了个图，应该直观一些，你理解下！

Answer 4

<div style="width:220px;">
<div style="float:left; width:100px; height:100px; background:#ccc;">如何在左边？</div>
<div style="float:right; width:100px; height:100px; background:#eee;">如何在右边？</div>
</div>

或者

<div>
<div style="float:left; width:100px; height:100px; background:#ccc; margin-right:20px;">如何在左边？</div>
<div style="float:right; width:100px; height:100px; background:#eee;">如何在右边？</div>
</div>

Answer 5

<div>
<div align="left">如何在左边？</div>
<div align="right">如何在右边？</div>
</div>