gpt4 book ai didi

火狐和 CSS3 : using overflow: hidden and box-shadow

转载 作者:技术小花猫 更新时间:2023-10-29 10:24:57 26 4
gpt4 key购买 nike

我不确定这个错误是只适用于 Firefox 还是也适用于基于 WebKit 的浏览器,但它确实非常令人讨厌。

我的 CMS 界面有一个模板/框架,在一些宽度为 100% 的元素上使用了 box-shadow。由于这会导致元素右侧出现阴影,因此会出现一个滚动条。为了隐藏丑陋的滚动条,我在包装器 div 的主体元素 上设置了“溢出:隐藏”。

这会导致一些奇怪的行为。虽然没有任何滚动条,但当我使用触摸板(水平滚动)滚动时,页面仍会向右滚动。我已经尝试了很多,并用谷歌搜索了我的屁股,但我似乎找不到解决这个问题的方法..

有人知道问题解决者吗?还是这只是 css3 box-shadow 实现冲突的一个例子?

最佳答案

我刚刚在设计时遇到了这个问题。基本上,Firefox 为任何超出页面右边缘的阴影创建了一个可滚动区域。无论出于何种原因,如果阴影向左延伸,Firefox 都不会创建可滚动区域。所以我的简单解决方案是将阴影完全移到左侧。

有问题的代码:

-moz-box-shadow: 5px 5px 5px #000;

简单的解决方案:

-moz-box-shadow: -5px 5px 5px #000;

我尝试将 x-offset 设置为 0px,但由于模糊度为 5,仍然有一个大约 2-3px 宽的可滚动区域。

关于火狐和 CSS3 : using overflow: hidden and box-shadow,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2344056/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com