jQuery Lightbox 2在随机图像中显示边框

Question

我使用了jQuery Lightbox 2，并且按要求正常工作。

但是，它在某些随机图像中显示边框。这是屏幕截图。

这是他们使用的图像的灯箱CSS。

<img class="lb-image" src="http://mywebsite/img/myimage.png">

.lightbox .lb-image {

    display: block;
    height: auto;
    max-width: inherit;
    max-height: none;
    border-radius: 3px;
    border: 4px solid white;

}

我发现此行border: 4px solid white;导致了此问题。如果我对此行发表评论，则边框不会显示。

但是，如果我不注释此行，则不会在所有图像上发生。在某些图像中，带有边框的工作正常。

我还检查了图像的上传方式，这是出现问题的完整图像。 （不过，我猜这是随机图像）。

因此，在这里我很困惑在这种情况下应该做什么才能在两种情况下都能工作。我应该删除边框吗？或任何其他我可以申请的东西。

请指导我。

Answer 1

我不认为边框是随机显示的..只是因为它是白色的，所以有时会与图像融合在一起。尝试将边框颜色更改为其他颜色以进行验证，即。

border: 4px solid red;

您还可能需要检查LightBox的宽度和高度-看起来可能被硬编码为正方形-这意味着如果原始图像不是正方形（1x1），那么当打开边框时，您还会看到一些其他间隙。 / p>

Answer 2

将.lightbox的height和width属性设置为自动。

如果这不起作用，请尝试此操作。由于图像是透明的，因此白色背景来自.lightbox元素。并且.lightbox元素的父级具有深色/黑色背景，您可以看到它们像border-right和border-bottom一样。发生这种情况是因为您的元素具有固定的宽度/高度排列。因此，将background-color元素的父元素的.lightbox更改为white。

如果您制作jsfiddle会更好，因为很难像这样调试它。