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

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

我无法想象这样的情况是行不通的。