Question

我正在使用插件bxslider（http://bxslider.com/），这通常效果很好。

我唯一的问题是该插件为其视口提供了5px的设置阴影，所以如果我在div中使用它，div上有彩色边框，它总是与该边框重叠 - 屏幕越小越明显交叠。

CSS中是否有一种确切的方法可以覆盖它（确切的原因是它需要在小屏幕/手机上工作）？

Firebug向我展示了以下用于视口的默认CSS：

.bx-viewport {
    background: none repeat scroll 0 0 #fff;
    border: 5px solid #fff;
    box-shadow: 0 0 5px #ccc;
    left: -5px;
    transform: translateZ(0px);
}

我尝试了以下功能来解决左边框的问题但是它与右边框重叠：

.bx-viewport {
    left:3px !important;
    padding-right:3px !important;
}

更新：当我将内部div的宽度设置为99％，但仅覆盖较大的屏幕，在移动设备上，1％的差异是不够的 - 这就是为什么我试图找到一个确切的解决方法。此外，问题仅适用于IE 8，因为在较新的浏览器中，CSS calc函数效果很好（width:calc(100% - 9px) !important;）。

非常感谢提供任何帮助，蒂姆。

Answer 1

假设您可以简单地使用：

，我错了

box-shadow: none !important

我无法想象那种无法发挥作用的情况。

CSS / bxSlider：如何避免图像重叠父div

1 个答案: