css-overflow-对同一元素设置overflow-x:visible;overflow-y:auto;属性值不生效

问题

对同一元素设置overflow-x:visible;overflow-y:auto;属性值不生效

根据W3C的说法,对同一元素设置overflow-x:visible;overflow-y:auto;属性值不生效,也就是说，overflow-x和overflow-y的计算值跟给定的值相同，除了某些跟’visible’值的不合理组合：如果一个其中一个属性的值被赋为’visible’，而另一个被赋值为’scroll’或’auto’，那么’visible’会被重置为’auto’。overflow的计算值与overflow-x相等（如果overflow-y相同的话）；否则就是一对overflow-x和overflow-y的计算值。其实另一个值设置为hidden的时候，visible也会被重置为auto。

解决原理：

原overflow-y:scroll和position:absolute都在ul内，.pop显示相对元素是ul，受overflow-y:scroll影响；改变相对元素，再ul外层加盒子div.all-box将position:absolute移至盒子则不受verflow-y:scroll影响。若要.pop高度起始位置以li位置为准则无法实现，li受verflow-y:scroll影响，以li为相对元素则.pop不会显示在ul外

预览