html – 允许在y轴上溢出同时隐藏x轴上的溢出

概述参见英文答案 > overflow-y:visible not working when overflow-x:hidden is present                                     2个 我试图允许y轴溢出,同时隐藏x轴上的溢出.有人可能会期望添加这些属性： .overflow { overflow-x: hidden; overflow-y: vis 参见英文答案 > overflow-y:visible not working when overflow-x:hidden is present 2个
我试图允许y轴溢出,同时隐藏x轴上的溢出.有人可能会期望添加这些属性：

.overflow {  overflow-x: hIDden;  overflow-y: visible;}

块级元素就足够了,但是由于一些CSS实现的怪癖,如here所述,这实际上并不起作用.最终发生的事情是overflow-y的计算值变为auto,而overflow-x保持隐藏状态.

有没有其他方法可以实现我想要的行为？

只是为了更详细一点,我有一个水平的项目列表,我正在使用自定义按钮滚动浏览.列表的包含元素的宽度远低于列表的宽度.我不希望出现滚动条,因为我使用自己的自定义按钮来浏览列表,因此我需要隐藏overflow-x.在悬停时,我想应用一个变换来扩大元素的大小,但我希望元素能够溢出包含元素的顶部和底部之外,因此需要overflow-y可见.

解决方法 如果你不介意添加一些额外的标记,似乎有一个简单的解决方案.

你只需要使用两个div,每个溢出一个.

例如：

<div >    <div >         <!-- your content here -->    </div></div>

以下标记：

.outer {       overflow-y: visible;}.mIDdle{    overflow-x: hIDden;}

似乎做了这个工作.

一个小例子here.

总结

以上是内存溢出为你收集整理的html – 允许在y轴上溢出同时隐藏x轴上的溢出全部内容，希望文章能够帮你解决html – 允许在y轴上溢出同时隐藏x轴上的溢出所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。