关于页面布局,求前台高手指教。

Ales_小溪 发布于 2013/08/12 15:12
阅读 270
收藏 0

关于div+css布局中,当给定父div的宽度和高度后,里面有2个div分别是float:left和float:right当在不同的浏览器中对该页面进行缩放时候,布局会变乱。大致代码如下:

html代码:

 <div id=“a”>       

    <div id="b">              
    </div>
    <div id="c">              
    </div>

</div>

css代码:

#a{width:1024px;height:600px;}

#b{width:700px;height:600px;}

#c{width:300px;height:600px;}

望各位不吝赐教,不胜感激!

加载中
0
xue777hua
xue777hua
哪里大乱了?另外你连float都没添加。。。
xue777hua
xue777hua
回复 @Ales_小溪 : 我把你的代码重新写了一遍,完全没问题。你肯定是一群代码中出现了这样的情况,只是因为你简单叙述了,把完整代码帖上来吧
Ales_小溪
Ales_小溪
说了的嘛 当页面缩放的时候布局会变乱 不知道你是否遇到过类似的情况
xue777hua
xue777hua
回复 @Ales_小溪 : 那你倒是说下 哪里大乱了?
Ales_小溪
Ales_小溪
可能我没有写出来,a{float:left} b{float:right}
0
欣儿
欣儿
用百分比比较好,或者用js来判断有没有缩放
0
znddzxx1122
znddzxx1122
缩放引起的布局乱套,我在老版本的IE浏览器 感受最深。
znddzxx1122
znddzxx1122
要兼容老版本的浏览器,代价不小,但收获挺小的。因为浏览器是会更新的,可能这个版本的浏览器存在这个问题,但等到下一个版本出来时,就解决了,所以不要纠结
Ales_小溪
Ales_小溪
请问当时你是怎么解决的呢 有什么高效的方法可以分享一下吗
0
我是潮汐
我是潮汐
http://zh.learnlayout.com/media-queries.html
0
我是潮汐
我是潮汐

利用min-width特性

0
工作流流流流流
工作流流流流流

第一种就是在最外边的div的width和height赋值为当前浏览器的width和height

里面的两个小div就是用百分比或者也是根据浏览器显示的width和height进行划分

这样就不会出现你说的问题了。

0
CeeFee
CeeFee

css 里加 reset,例如:

html,body,div { margin: 0; padding: 0; border: 0; }

具体,自己 Google 一下!!!

0
王瑞平
王瑞平

横行各个元素display:inline;float:left,宽度充满,不足部分用空《div》

一个横行一个横行写,这样就不会乱

0
梅开源
梅开源
b向右浮动,a向左
返回顶部
顶部