一个DIV里面包含3个靠左的div和2个靠右的div,靠右的分行了,如何让他们显示在同一行?

<div style="width:950px; height:480px;">
<div style="width:190px; height:160px; border:1px #cccccc solid; margin:10px 0 0 0; float:left;"> </div>
<div style="width:190px; height:200px; border:1px #cccccc solid; margin:10px 0 0 0;float:left;"> </div>
<div style="width:190px; height:75px; border:1px #cccccc solid; margin:10px 0 0 0;float:left;"> </div>

<div style="width:750px; height:250px; background-color:#000; margin:5px 0 0 0; float:right; " > </div>
<div style="width:750px; height:200px; background-color:#000; margin:5px 0; float:right"> </div>
</div>

你的写法有错误!!首先你的左边三个div必须用一个大盒子 右边的两也得用一个大盒子! 然后让这两个大的盒子一个左浮动 另一个右浮动!!因为浮动是跟据前面的一个层来浮动的,像你那样写的话它是把左浮动执行完以后才执行右浮动的!!
<div style="width:950px; height:480px;">
<div style=" width:190px; float:left">
<div style="width:190px; height:160px; border:1px #cccccc solid; margin:10px 0 0 0;"> </div>
<div style="width:190px; height:200px; border:1px #cccccc solid; margin:10px 0 0 0;"> </div>
<div style="width:190px; height:75px; border:1px #cccccc solid; margin:10px 0 0 0;"> </div>
</div>
<div style="width:750px; float:right">
<div style="width:750px; height:250px; background-color:#000; margin:5px 0 0 0;" > </div>
<div style="width:750px; height:200px; background-color:#000; margin:5px 0;"> </div>
</div>
</div>
温馨提示:内容为网友见解,仅供参考
第1个回答  2010-10-06
css样式的float 指的是把元素浮动。 像水里的东西一样浮动。

所以, 当你的页面的宽度不够时,它会向下移动。

解决方法是,把向右移动的div的宽度有750 调成较小的。比如 150 就可以显示在同一行了。

css要灵活运用,加油。。
第2个回答  2010-10-07
你那个大的div宽度,,width太小,,容不下几个div并排,,把它设置大点就OK了,,给我分吧
第3个回答  2010-10-11
出现分行的原因是 子集超出了父集。
里面的5个DIV宽度加起来要小于 950PX
第4个回答  2010-10-11
我觉得楼上的第二个div不用加float:right了,剩下的都还行

一个DIV里面包含3个靠左的div和2个靠右的div,靠右的分行了,如何让他们...
左边3个div放在一个div中,右边2个也放入一个div中,粘贴看效果 <div style="width:950px; height:480px;"> <div style="width:192px;float:left;"> <div style="width:190px; height:160px; border:1px #cccccc solid; margin:10px 0 0 0;"> <\/div> <div style="width:190px; h...

一个DIV里面包含3个靠左的div和2个靠右的div,靠右的分行了,如何让他们...
首先你的左边三个div必须用一个大盒子右边的两也得用一个大盒子!然后让这两个大的盒子一个左浮动另一个右浮动!!因为浮动是跟据前面的一个层来浮动的,像你那样写的话它是把左浮动执行完以后才执行右浮动的!!<divstyle=width:950px;height:480px;<divstyle=width:190px;float:left<divstyle...

怎么在一个div里面让三个div一排显示
1、打开HTML编辑器(以hbuilder为例)2、在左侧空白处右击新建web项目;3、输入项目名称,点击确认;4、在左侧点开项目双击index页面;5、将下面代码复制到<body>中;<div class="app"> <div style="display:inline-block;background:#f00;">div1<\/div><div style="display:inline-block;backgro...

css如何让三个DIV并列在一行中
1、首先打开用到的编辑工具这里用DW 2、为了方便观察,我们把三个div设置三个背景颜色来观察,设置三个div样式这里取名:div1 div2 div3 并且引用三个样式;详解:background:#颜色;是取的三个不同的div背景颜色;给三个div设置宽度为width:300px高度height:200px;3、展示出来的效果如图:...

在HTML中,如何让两个DIV在同一行显示?
创建一个父div,然后创建两个子div,代码如下:给div加上css样式,分别给他们设置背景颜色,父div可以不设置,子div设置绿色,然后给div加上浮动代码即可,"float:left"我们来写一下代码:下面我们来看一下运行效果 DIV是层叠样式表中的定位技术,全称DIVision,即为划分。有时可以称其为图层。DIV在编程...

css怎么使一个div的高随另一个div的高的变化而变化,还有就是怎么使第...
这样给你说好了,你现在一共四个div,最上面一个,中间左边一个,右边一个,最下面一个,你无非是想让他们都居中所以用position absolute,但是你可以这样:在4个div外面加上一个div,设置为居中,高度为100%,宽度你自己用你觉得合适的值,overflow-y设置为auto;然后对你原本存在的最上面的那个div...

怎么在一个div里面让三个div一排显示
利用css属性里面的float属性。首先写上3个div:<div class="box1">这是第1个div<div><div class="box2">这是第2个div<div><div class="box3">这是第3个div<div>接下来写css:.box1,.box2.box3 { float:left; }这样三个div就会一排显示了。

如何让2个div并排显示在同一个网页中呢?
1、首先如图所示的web结构即一个html和css即可实现。2、打开html页面 定义一个大的div和两个小div 如图所示。3、最常用的float浮动,只要两个小div的宽度小于等于大div的宽度,即可实现并排了。4、使用position进行绝对定位,然后使用margin-left除去第一个小div的宽度即可。5、使用table盒子实现div并排,...

一个大的div套三个小div,如何让三个小div平均分配???
1、首先需要打开自己电脑上的DW软件,然后新建一个html页面,并保存在桌面上。2、然后需要在该html页面的body部分敲入部分代码,基本上就是一个父级DIV下面有三个子级DIV。3、然后在三个子div中输入文字,在浏览器中测试,查看效果,可以看到默认情况下三个div是竖排显示的。4、接下来要这四个div赋予...

当一个div中包含两个div ,这个两个div怎么才能排成一排?
1、采用浮动,只是这两个div要两个都浮动才行。如都左浮动:代码 [html] view plain copy <span style="font-size:18px;"><body> <div style="background-color:red;width:200px;float:right;">DIV1<\/div> <div style="background-color:yellow;width:200px;float:right">DIV2<\/div> <...

相似回答