JS Wide Showcase 的问题没有在移动设备上拉伸全宽答案

【问题标题】：Issue with JS Wide Showcase not stretching full width on mobileJS Wide Showcase 的问题没有在移动设备上拉伸全宽
【发布时间】：2014-09-17 21:38:26
【问题描述】：

我正在建设这个网站http://www.saraswati.co.uk

如果您在此处查看：

http://www.saraswati.co.uk/?page_id=12

您会看到我正在使用 Wide Showcase Wordpress 插件，该网站是使用 Bootstrap 在 Wordpress 中构建的，并且是响应式的。

一旦您到达 Bootstrap 767px 断点之下，就会有一些 CSS 代码导致页面超出 Wide Showcase 的宽度，我想停止这种情况。

因此，如果您在移动设备上查看，其他任何地方都可以，您会在右侧看到大约 60 像素的主页背景是由某些 CSS 引起的。

我已经在 Web Inspector 中测试了打开和关闭各种 CSS 设置，但还没有找出导致问题的原因。

帮助会很大。

蚂蚁

【问题讨论】：

问题来自 Wide Showcase Wordpress 插件的 CSS。
谢谢亨利，有什么更详细的，谢谢。
我只是看了一下代码。请在下面查看我的答案，这可能会有所帮助。需要注意的是，滑块图像在移动屏幕尺寸下表现不佳。您可能值得向插件开发人员提出支持票以提醒他们注意问题。他们可能会很感激
有点坏了，效果不错，但我认为开发人员没有在响应方面投入任何工作。我不得不做很多 CSS hack 来让它在不同的设备上呈现，但还没有完成。感谢您的帮助:-)

标签： wordpress css responsive-design twitter-bootstrap-3

【解决方案1】：

尝试覆盖一些 Wide Showcase Wordpress 插件的样式。

@media ( max-width: 767px ) and ( min-width: 0px ) {
    .wdRegularSliderMin {
        margin-left: 0;
        margin-right: 0;
    }
}

body {
    width: auto;
}

将其添加到您的 WordPress 主题的 style.css 将摆脱您在移动设备和平板电脑屏幕尺寸上看到的水平滚动条。

【讨论】：

这还没有解决，我现在两侧都有空间，而不是右侧，我认为有一个父容器设置了该空间量，并且它正在被插件css低于767px断点，就是想不通是什么。
好的解决了，Bootstrap 有很多代码，这是福也是祸，在 767px 断点以下，body 上的 padding-left 和 right 设置为 20px，我试图解决这个问题负边距，一旦设置为 0px，然后我在 body 上找到了低于 767px 的引导编码填充。
我的代码只是修复了水平滚动问题。它不是为了修复图像两侧的侧翼空间。很高兴您也能找到解决方案。
很酷，是的，这是我正在解决的问题，感谢您的帮助。