HTML / CSS hack允许overflow-x:auto& overflow-y:visible? [英] HTML/CSS hack to allow overflow-x: auto & overflow-y: visible?

查看:256
本文介绍了HTML / CSS hack允许overflow-x:auto& overflow-y:visible?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个400px x 400px的div,我想垂直滚动。所以我设置overflow-y:auto。但偶尔,我想要div内的内容overflow-x:visible。

I have a 400px x 400px div that I want to scroll vertically. So I'm setting overflow-y: auto. But occasionally, I want the content inside the div to overflow-x:visible.

这不行。我认为这是因为如果其中一个可见,您不能设置不同的溢出值。

This doesn't work. I think it's because you can't set different overflow values if one of them is visible.

True?

否则,有没有一个体面的css / js修复这个?我注意到流程应用程序附加一个计算,绝对位置div的身体,当这样的情况发生时: http://cl.ly/32392W0U2t1y2Q103X2d。这是最好的解决方案吗?有没有任何插件/教程来看看?

Otherwise, is there a decent css/js fix for this? I noticed flow app appends a calculated, absolutely-position div to the body whenever a situation like this occurs: http://cl.ly/32392W0U2t1y2Q103X2d. Is this the best solution? And are there any plugins/tutorials to look at?

推荐答案

如果其中一个可见; CSS3框模型草案在溢出部分说明了这一点:计算值'overflow-x'和'overflow-y'与它们的指定值相同,除了一些带有visible的组合是不可能的:如果一个被指定为visible,另一个是scroll ',那么'visible'设置为'auto'。

You can’t set different overflow values if one of them is visible; the CSS3 Box Model draft says this in section on overflow: "The computed values of ‘overflow-x’ and ‘overflow-y’ are the same as their specified values, except that some combinations with ‘visible’ are not possible: if one is specified as ‘visible’ and the other is ‘scroll’ or ‘auto’, then ‘visible’ is set to ‘auto’."

有关解决方法,您首先需要决定所需的行为。当你有一个滚动条在右边,overflow-x:visible工作如何?如果溢出的内容继续在滚动条的右边不知何故?这将很难安排。或者滚动条是否应该向右移动?

Regarding workarounds, you would first need to decide what the desired behavior is. When you have a scroll bar on the right, how would overflow-x: visible work? Should the overflowing content continue on the right of the scroll bar somehow? This would be difficult to arrange. Or should the scroll bar move to the right?

这篇关于HTML / CSS hack允许overflow-x:auto& overflow-y:visible?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆