Javascript Flexslider全屏在mobile中未居中

我使用的是全屏背景，它可以在我的笔记本电脑和大屏幕上正常工作。问题是当我从移动设备进入网站时。背景图像（及其上方的按钮）移到侧面。我不知道这是为什么。我认为它必须与bootstrap.min一起使用

HTML：

<!-- Intro Section -->
    <section id="intro">
        <!-- Hero Slider Section -->
        <div class="flexslider fullscreen-carousel hero-slider-1 ">
            <ul class="slides">

                <!--Slide-->
                <li data-slide="dark-slide">
                    <div class="slide-bg-image overlay-light dark-bg parallax" data-background-img="images/connexion_background.jpg">
                        <div class="js-Slide-fullscreen-height container">
                            <div class="intro-content">
                                <div class="intro-content-inner">
                                    <br />
                                    <div><a class="btn btn-md btn-white" href="contact.php">Request a Quote</a><span class="btn-space-10"></span><a class="btn btn-md btn-white " href="research-solutions.html">View Our Solutions</a></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </li>


            </ul>
        </div>
        <!-- End Hero Slider Section -->
    </section>
    <div class="clearfix"></div>
    <!-- End Intro Section -->

这就是移动通信的结果：

按钮和背景图像向右移动。它们没有居中，背景图片会自动重复

我可以在Mozilla的开发工具上看到：

任何帮助都将不胜感激

---

谢谢。

将幻灯片中的图像居中，并将其添加到css中

.flexslider img { margin: 0 auto; }

或

---

}

您能否尝试在css文档的最后添加以下css

.flexslider ul.slides {
 padding: 0 !important;
}

---

您的flex slider left位置不正确，您只需使用

left

属性修复此问题，然后使用下面的代码进行尝试

.fullscreen-carousel .slides li {
    height: 100%;
    left: -40px; /* newly added */
    overflow: hidden;
    position: relative;
}

您是否也可以尝试一下，删除

左侧：-40px

并将此jquery添加到页面中

$(window).load(function() {
   $('.flexslider').flexslider();
   $(window).trigger('resize');
});

---

当然，你能提供任何工作联系吗。这是链接：检查我的答案，你可以简单地用

left

property解决这个问题。我认为这与引导有关，而不是css。无论如何，谢谢。@dileoh bootstrap是css，如果它不起作用，请提供工作链接。它起作用了，但当我刷新页面时，它仍然会移到一边，但会移到右边。你需要在样式表上设置它。是的，我这样做了，但当我刷新页面时，它会移到一边，但现在移到另一边。我不知道它是什么。尝试下面的答案也行，但当我刷新页面时，我遇到了与以前相同的问题。有什么想法吗？我只是在chrome iphone 5、6、6+模拟上测试了一下&它们都可以工作，甚至可以刷新页面。你能分享一些屏幕吗？

.fullscreen-carousel .slides li {
    height: 100%;
    left: -40px; /* newly added */
    overflow: hidden;
    position: relative;
}

$(window).load(function() {
   $('.flexslider').flexslider();
   $(window).trigger('resize');
});