这个问题关系到这两个:
1.CSS -应用填充与滚动框,底部填充不起作用
2. 底部填充,溢出的元素上不工作在非Chrome浏览器,
但我没有找到它为什么会发生的任何地方,这意味着,为什么在Chrome(31)和Opera(18)中出现了填充,而在Firefox(26)和IE(9-10)中却没有.
这是我的测试用例:http:
//jsfiddle.net/eW39h/4/
相关问题#1中的一个更简单的例子:http:
//jsfiddle.net/rwgZu/
<div id="container">
<div id="innerBox"></div>
</div>
#container {
padding: 3em;
overflow-x: hidden;
overflow-y: auto;
width: 300px;
height: 300px;
background: red;
}
#innerBox{
height: 400px;
background: #000;
}
Run Code Online (Sandbox Code Playgroud)
我不是在寻找修复,而是要了解正确的实现究竟是什么(以及哪些浏览器错了:-)).
编辑 2013年12月18日
根据Marc Audet的回答,我挖掘了规范并制作了一个新的测试用例.
http://jsfiddle.net/rwgZu/79/
这里显而易见的是,所有浏览器都在同一点剪切溢出框,这是填充边缘",这确实符合规范:
每当发生溢出时,'overflow'属性指定是否将框剪切到其填充边缘
而且,在Chrome中,内盒后面还有一个额外的填充物.
有趣的是,在内部框中添加溢出的内容会在所有浏览器上产生统一的结果:http:
//jsfiddle.net/uPY8j/1/
我在规范中找不到这种条件的规则,所以我现在仍然要问这个问题.
我最近从Sublime Text 3转到了WebStorm 11,在选择相同选择的出现时我错过了一个关键功能:
跳过选择的能力(使用热键).
const item = { itemValue: 1, itemName: 'one' };
console.log(item.itemValue);
Run Code Online (Sandbox Code Playgroud)
选择第一个item并按下Ctrl + G(Mac)将开始选择item对象属性中的事件,并且我只想item在const内部和内部之后选择console.log.基本上,我想跳过item对象内的两次出现.
这是一个虚拟用例来说明这一点,我知道我可以重构>重命名它.