div+css布局问题：我用div1、div2、div3，后面两个div嵌套在div1里面，div2的css是向左浮动的，怎样设置。


怎样设置div2的css呢？，不至于使div2跑到div1外面去呢？

追问：好像要清除浮动吧，但不晓得怎样写我是在代码视图里面写的好像是这样，可能我哪里标签有问题吧，我再看看

答案：<!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=gb2312" />
<title>无标题文档</title>
<style type="text/css">
.div1{width:500px;height:300px;background:#006666;overflow:hidden;}
.div2{width:300px;height:200px;background:#339966;float:left;}
.div3{width:190px;height:200px;background:#CCCC00;float:right;}
.clear{clear:both}
</style>
</head>
<body>
<div class="div1">
	<div class="div2">我是DIV2</div>
	<div class="div3">我是DIV3</div>
	<div class="clear"></div><!--清除div1、div2的浮动-->
</div>
</body>
</html>

其他：浮动方式都用左对齐不就行了！你应该会呀！不会跑出去的 <style type="text/css">
.div1 {
	width:500px;
	height:500px;
	background-color:#CCC;
}
.div2 {
	float:left;
	width:250px;
	height:300px;
	color:#F00;
	background-color:#000;
}
.div3 {
	float:left;
	width:250px;
	height:300px;
	background-color:#fff;
}
</style>
<div class="div1">
	<p>我是div1</p>
	<div class="div2">
    <p>我是div2</p>
    </div>
    <div class="div3">
    <p>我是div3</p>
    </div>
</div> 为了看的更清楚，简洁的说明问题，这样即可：
Xhtml Code:
<div class="div1">
  <div class="div2">div2</div>
  <div class="div3">div3</div>
</div>
Css Code:
.div1{ background:#eee; float:left; padding:10px; width:200px;}
.div2{ background:#ddd; float:left; width:100px;}
.div3{ background:#ccc; float:right; width:100px;}
div1 也写上 float:left; 这样它可以随着 div2 , div3 的高度变化而变化，否则就只能定高，不能做到自适应，这样是我们所不希望的。你可以去掉div1的float:left 试一下，就看到区别了。 楼主还要设置div1的宽度和高度
以及浮动 就可以了 <div id="div1" style="width:420px;height:auto;">
<div id="div2" style="float:left;width:200px;"></div>
<div id="div3" style="float:left;width:200px;"></div>
<div style="clear:both;"></div>
</div>

更多图片编程知识: