我有一个绝对定位的元素在页面的“外部”,但我希望浏览器(我使用的是Firefox 3)不显示水平滚动条。-20px”)是可以的,并且不显示滚动条。-20px”)总是显示滚动条。有没有可能隐藏滚动条,但保持标准滚动可能?我的意思是,我只想禁用滚动由于这个绝对定位的元素,但保持滚动由于其他元素(我知道我可以完全禁用滚动条,这不是我想要的)。
<!DOCTYPE html>
<html>
<body>
<div id="el1" style="position: absolute; top: 0; background-color: yellow; left: -20px;">
element
</div>
<div id="el2" style="position: absolute; top: 0; background-color: yellow; right: -20px;">
element
</div>
<h1>Hello</h1>
<p>world</p>
</body>
</html>
7条答案
按热度按时间6jjcrrmo1#
是的,这是可能的,在你的html标签上,输入
style="overflow-x: hidden"
。这就可以了...lzfw57am2#
这实际上可以使用直接的CSS来完成,而不需要对页面宽度等有任何限制。它可以通过以下方式完成:
1.创建一个具有隐藏溢出区的div,它绝对位于页面的左上角。使其宽度和高度为100%
1.创建另一个相同的div,但没有隐藏溢出
1.为div添加一个类,该类将包围所创建的div的内容,使其位置相对,并为它提供您希望主页内容具有的任何宽度
1.在您创建的每个div中添加该类的内容。
第一个div中的内容将与第二个div中的内容保持正确对齐,但其超出窗口边界的任何内容都将被截断。
下面是一个工作示例,它将图像保持在相对于其余内容的固定位置,而不使用任何JavaScript:
第一个
ckocjqey3#
您需要做的是在div之外添加一个 Package 器。
下面是CSS:我将我的类称为“main_body_container”
希望对你有帮助:)
更新
为它创建了一个画笔,查看它here
xdnvmnnf4#
不太确定这是否有帮助,但您可以尝试将所提到的div的样式改为:
通过将位置设置为固定,它将指定的div“锁定”在适当的位置,而其余的内容仍然是可滚动的。当然,这是假设在该示例中,其余的内容是由z-索引堆叠在定义的div的顶部。
希望这对你有帮助。
cbjzeqam5#
我可以通过将元素的
position
属性更改为fixed
来解决这个问题:此元素不再引起水平滚动,但其他元素仍引起水平滚动。
f0ofjuux6#
将以下内容添加到CSS:
IE无法识别overflow-x和-y样式。所以如果你只关注Firefox 3,这将是正常的。否则,你可以使用一些javascript:
uqjltbpv7#
把下面的样式
我在IE 8、FF和Chrome上进行了测试。