Flexslider 将视口渲染关闭 1px [关闭]答案

【问题标题】：Flexslider renders viewport off by 1px [closed]Flexslider 将视口渲染关闭 1px [关闭]
【发布时间】：2016-05-06 07:39:51
【问题描述】：

所以我正在建立这个网站，一切都很好。但是，我刚刚意识到 flexslider 仅在桌面大小的显示器上从视口右侧切割不到 1 像素.....我一直在寻找类似问题的答案，但没有任何效果。救命！

【问题讨论】：

【解决方案1】：

虽然我现在无法在 Chrome 中复制此问题（您使用的是什么浏览器？），但很可能是由以下原因引起的：在您的 CSS 中，您的宽度大于 100%。

.flex-viewport {
    width: 100.1% !important;
    border: 1px solid #d7d7d7;
}

将其降至 100%，您应该会看到此问题消失。

（请注意，通常问题仍然会发生，因为边框会在 100% 宽度之外，但因为您使用的是border-box for box-sizing，所以边框包含在宽度计算中）

【讨论】：

感谢您的关注。这实际上是在问题发生后添加的，以尝试纠正它。视口的宽度将设置为 1066.64 像素，幻灯片的宽度将设置为 1067 像素。所以我的边界被切断了。我最终只是删除了内容的边框并在视口周围设置了一个边框。这不是我想要做的，但它看起来不错。再次感谢您的关注！哦，我在 Mac 上使用 chrome
很高兴你解决了它。可能对将来的问题有用，以便在您的问题（或 pastebin）中发布相关的 CSS，这样您就可以在人们查看您的问题时继续开发。否则我们最终会查看您已经更改的代码:)
我完全同意，我的项目进度落后了，而且有点恐慌，哈哈。下次我会确保粘贴一些代码。

【解决方案2】：

如果我理解正确你的意思...

问题出在这里：

.flex-viewport {
    width: 100.1% !important;
    border: 1px solid #d7d7d7;
}

然后，改变宽度：

.flex-viewport {
    width: 100% !important;
    border: 1px solid #d7d7d7;
}

问题解决了，大家开心。

【讨论】：

感谢您查看它，但我实际上更新了该 css。基本上，问题是在 flexslider 渲染视口时发生的。视口的宽度将设置为 1066.64 像素，幻灯片的宽度将设置为 1067 像素。所以我的边界被切断了。我最终只是删除了内容的边框并在视口周围设置了一个边框。这不是我想要做的，但它看起来不错。再次感谢您的关注！
好吧。大家又开心起来了。 :)