张鑫旭-overflow的细节笔记

overflow的一些小问题

overflow-x和overf-y同时使用的问题

如果overflow-x和overflow-y二者的值相同，等同于overflow； 如果二者值不同，其中一个被赋予visible；另一个被赋予auto，hidden，scroll，其中visible会被重置为auto。

table中的问题

table中td设置尺寸和overflow:hidden不起作用，此时需要table为table-layout:fixed;才会起作用

IE7下的button padding问题

overflow:scroll的出现

所有的scroll均是来自于html，不是body。证明就是body本省是有.5em的的margin。可是滚动条确实贴着html的。

ie7及以下

默认右侧始终有一个scroll的条。即使你的内容一个字没写。所以他的默认css的overflow-y:scroll

IE8+

默认是overflow：auto

chrome和其他浏览器

在这里，奇葩的是chrome了。

chrome下获取滚动高度是document.body.scrollTop，
而其他的是document.documentElement.scrollTop，

所以推荐的兼容写法是：

var scrollTop = Math.max(document.body.scrollTop, document.documentElement.scrollTop);

padding-bottom缺失

在非chrome浏览器中。如果滚动区域写了上下padding,那么padding-bottom会缺失

滚动条导致布局问题

滚动条是会占据宽度的，所以最好是把宽度预留足够。