Question

一个大的DIV中嵌套两个小的DIV一左一右

这是代码.max
{ width:1000px;
height:2800px;
margin:0 auto;
} 这是最大的DIV
.left
{ width:245px;
height:2000px;
margin-top:20px;
margin-left:50px;

} 这是左边最大的DIV
.right
{ width:640px;
float:left;

}这是右边最大的DIV
这是实现出来的效果
右边的DIV被挤到下面去了 两个小的DIV宽度没有超过最大的 这是为什么 怎么解决

Answer 1

大的DIV中嵌套两个小的DIV一左一右步骤如下：

1，首先，图中显示的Web结构是html和css。

2，打开html页面，如图所示，定义一个大div和两个小div。

3，最常用的float float，只要两个小div的宽度小于或等于大div的宽度，就可以并排实现。

4，使用position进行绝对定位，然后使用margin-left删除第一个小div的宽度。

5，使用表格框并排实现div，这是相同的宽度。

6，如图所示，这是上面三种方法运行后的结果，可以看到两个大DIV嵌套在一个大DIV中。

Answer 2

1、首先如图所示的web结构即一个html和css即可实现。

2、打开html页面 定义一个大的div和两个小div 如图所示。

3、最常用的float浮动，只要两个小div的宽度小于等于大div的宽度，即可实现并排了。

4、使用position进行绝对定位，然后使用margin-left除去第一个小div的宽度即可。

5、使用table盒子实现div并排，这个是等宽的。

6、如图所示 这是上面三个方法运行后的结果图，可以看到一个大的DIV中嵌套两个小的DIV。

Answer 3

1、首先我们如图所示的web结构即一个html和css即可实现。

2、打开html页面 定义一个大的div和两个小div 。

3、两个小div的宽度小于等于大div的宽度，即可实现并排了。

4、使用position进行绝对定位，然后使用margin-left除去第一个小div的宽度即可。

5、用table盒子实现div并排，这个是等宽的。

6、使用display：inline（将div设置为内联）实现并排效果。

7、如图所示 这是上面三个方法运行后的结果图，可以看到两个div并排了。

Answer 4

1 你可以让左边最大的Div左边浮动，然后让右边的DIv 右边浮动就可以了。
.left
{ width:245px;
height:2000px;
margin-top:20px;
margin-left:50px;
float:left;//加上这句
}
.right
{ width:640px;
float:right;//换成这样
height:1000px;//给他加个高度。
}

2 你可以让左边的DIV和右边的DIV都向左浮动。即都加上float:left;
3 你可以让左边的DIV和右边的DIV都向右浮动。即都加上float:right;(注：先写右边div的代码，然后在写左边的)

推荐用第一种方法 。

追问

谢谢啊，被纠结的脑子都乱了 给右边的加了一个高度 设置了左右的float就上去了
但是我设置右边的时候 像你说的一样float:right 但是我右边的DIV是写在左边的DIV后面的
效果还是达到了 为什么！
还有在火狐下 效果是正常的
但是在IE6下 还是老样子 没有改变 这该怎么解决呢 求解

追答

IE6 下如果没有变的话，可能是因为 IE6 的双边距的问题。
你可以在加一句：display:inline.在第二个div 上。

因为没有看到你的html代码，也很难分析什么地方有问题，只能大概加估计了

Answer 5

多余的我不说了，直接给你解决好了
你现在的大概布局应该是：
<div class="max">
<div class="left"></div>
<div class="right"></div>
</div>
你改成：
<div class="max">
<div class="right"></div>
<div class="left"></div>
</div>
应该就好了

注：有右浮动的时候，这个div就要写到代码的前面，否则会被没浮动的div顶下去，这是最基本的常识，原因也懒得探究，了解一下就好