一个div浮动的问题
2012-02-10 13:51
85 查看
页面上有一个div,里面要动态加载很多浮动的小div,刚开始在ie下面测试的,生成的小div排列都是正确的,然后在chrome下测试发现一个很奇怪的问题,发现小div不能顶到父级div的最左边,然后我赶紧查看它的样式,发现设置的left是为0的,但是它隔父级的左边框很远。最后想起来了,关于css浮动的问题,如果是浮动话,那么在浮动的过程中一旦有其他元素拦住了浮动元素,那么浮动元素就自然停靠在被拦住的位置,估计是这个问题,而且ie下面因为width和height是指整个元素,所以在ie下设置的话很容保持一致,但是在chrome下仅设置height和width的话是不够的,还要考虑margin和padding甚至border等等参数,否则当浮动的上方元素因为margin或者padding等的设置挡住了浮动元素就会出现这种问题,最后修改了浮动元素父级元素的padding,是浮动元素往下多靠一点远离上方可能挡住它浮动的元素,效果就正确啦;另外可以考虑浮动的另外一种特点,上下两个元素的外边距相遇时,它们之间的距离由margin值更大的来确定,为了让下面元素的子元素在滑动时不会受到上面元素的下margin影响,我把下面元素的上margin值设置得比上面元素的下margin更大,这样该元素内部最上面的元素在向左滑动时就不会被其他因素影响啦。哎,万恶的浏览器啊,求一统啊,呵呵。
相关文章推荐
- 三个div,一个左浮动,一个有浮动,另外一个不浮动引发的样式问题
- js 创建一个浮动div的代码
- 处理div+css布局左右浮动问题
- 一个div中的宽度问题解决
- 两台相同电脑的版本号相同的IE8浏览器的不兼容问题,一个正常,一个div横向拉长(已经解决)
- 解决了DIV+CSS一个问题
- React+AntD+AntV 前端实例 鼠标移动事件 触发显示 浮动DIV图层(展现一个趋势图)
- 如何让一个DIV浮动在另一个DIV上面
- 解决<input type=“file” multiple> 多文件上传问题(可以多次选取文件,也可以一次选取多个文件),而且点击的是一个同一个div
- div在内部有浮动情况下不能自动撑大的问题
- 今天遇到一个问题,听我细细道来一个div id=a 里面还有一个div id =b 问题是点击a会弹出a 那么点击b 会弹出b紧接着弹出a 我想实现的效果是点击b只弹出b
- 关于div中放入一个img元素导致div高度会多出几个像素的解决问题
- js 鼠标点击一个按钮显示div的浮动框,点击页面其他任何地方后,隐藏浮动框
- "把一个div标签,给它的属性设置position: fixed;bottom:0;固定在浏览器的最底部。 这个div标签在浏览器上下滚动的时候,会一直保持在屏幕最底部,这一点没有问题。但问题是当浏览
- 关于在同一个DIV下的Hover效果问题
- 如何居中div?如何居中一个浮动元素?
- IE6/7下同级只有一个元素浮动,会换行问题
- 【解决方案】子div用了float浮动之后,如何撑开父元素,让父元素div自动适应高度的问题
- 显示和隐藏一个div的问题
- 子div浮动无法撑开火狐下的父div问题