CSS“概述”Webkit和Gecko上的不同行为行为

我正在做一个实验&我发现“大纲”CSS2属性不是以相同的方式实现Webkit&壁虎

在下面的脚本中,我有一个绝对位置div在另一个div,但漂浮在它外面。 Webkit上的大纲概述了实际的父div,而在Gecko上,它扩展以覆盖子项。

http://jsfiddle.net/KrCs4/

我缺少什么吗?有没有属性,我需要覆盖Gecko?或者应该报告为错误?

Webkit屏幕截图:

Firefox屏幕截图:

编辑:

它确认是一个错误,这里是一个解决方法:http://jsfiddle.net/7Vfee/(你需要确保父的位置:相对或绝对的这个解决方法工作。

解决方法

Gecko的这种不一致的行为是众所周知的,并且有相当充分的记录,虽然奇怪的是不在MDN但在 SitePoint Reference

Firefox up to and including version 3.5 will draw the outline outline around the content of an element that has overflowed its boundaries rather than around the element’s actual set dimensions.

这继续影响所有版本的Firefox。我现在没有看到一个可行的解决方法,它除了删除你绝对定位的div和其父,并将其相对于其他的东西。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


css的bordercolor属性怎么使用
CSS中contain属性的作用和语法
深入学习响应式布局框架:适合初学者到专家的详尽指南
CSS3选择器优先级规则
margin-top用法
选择最适合您的响应式布局框架:综合评估不同工具
使用CSS中的content属性
设计一个无缝适应不同屏幕尺寸的网站
如何处理CSS样式的层叠问题
探究最佳响应式布局框架:竞争激烈!
学习基本数据类型的快速入门:掌握常用操作技巧
CSS中float布局介绍
一同探讨响应式布局的益处
掌握响应式设计的益处,让网页在不同设备上展现完美适配!
可能导致CSS加载失败的原因有哪些?
各种基本数据类型的全面操作指南
CSS3选择器是否用于设计界面结构?
响应式布局优化移动设备适配的策略与实用技巧
伪元素怎么清除浮动
利用CSS响应式布局创作独特网页设计的设计技巧