在Wordpress中将图库移动到页面中心

Question

最近我发布了关于如何将我的画廊定位到中心的问题，并收到了许多成员的answer。今天复制了这个网站，并开始在another fork site上工作，和以前的一样，主题相同。我使用了相同的CSS，就像在前面的帖子中一样：

.flex-active-slide {
 text-align: center;
}

但似乎没有做任何改变。我检查了CSS类，来自第一个站点和第二个站点，它有一点不同，所以我应用了这个CSS：

.col-lg-6 {width:100%;}
.flex-active-slide {
 text-align: center;
}

但是看不到任何变化。帮帮忙？

EDIT:这是该元素的整个CSS类：

    <div class="col-lg-6">
                                <div class="gallery-single-post clearfix">
                                    <div class="clearfix" id="slider">

                                            <div class="flex-viewport" style="overflow: hidden; position: relative;"><ul class="slides" style="width: 1200%; transition-duration: 0s; transform: translate3d(0px, 0px, 0px);">
            <li class="flex-active-slide" style="width: 555px; float: left; display: block;"><a href="http://spas-hammam.com/wp/wp-content/uploads/2014/05/gallery-31.jpg" title=""><img src="http://spas-hammam.com/wp/wp-content/uploads/2014/05/gallery-31-670x500.jpg" alt="gallery-3" draggable="false"></a></li><li style="width: 555px; float: left; display: block;"><a href="http://spas-hammam.com/wp/wp-content/uploads/2014/05/gallery-11.jpg" title=""><img src="http://spas-hammam.com/wp/wp-content/uploads/2014/05/gallery-11-670x500.jpg" alt="gallery-1" draggable="false"></a></li><li style="width: 555px; float: left; display: block;"><a href="http://spas-hammam.com/wp/wp-content/uploads/2014/05/gallery-41.jpg" title=""><img src="http://spas-hammam.com/wp/wp-content/uploads/2014/05/gallery-41-670x500.jpg" alt="gallery-4" draggable="false"></a></li><li style="width: 555px; float: left; display: block;"><a href="http://spas-hammam.com/wp/wp-content/uploads/2014/05/gallery-5.jpg" title=""><img src="http://spas-hammam.com/wp/wp-content/uploads/2014/05/gallery-5-670x500.jpg" alt="gallery-5" draggable="false"></a></li><li style="width: 555px; float: left; display: block;"><a href="http://spas-hammam.com/wp/wp-content/uploads/2014/05/gallery-6.jpg" title=""><img src="http://spas-hammam.com/wp/wp-content/uploads/2014/05/gallery-6-670x500.jpg" alt="gallery-6" draggable="false"></a></li><li style="width: 555px; float: left; display: block;"><a href="http://spas-hammam.com/wp/wp-content/uploads/2014/05/gallery-7.jpg" title=""><img src="http://spas-hammam.com/wp/wp-content/uploads/2014/05/gallery-7-670x500.jpg" alt="gallery-7" draggable="false"></a></li>        </ul></div><ul class="flex-direction-nav"><li><a class="flex-prev flex-disabled" href="#" tabindex="-1">Previous</a></li><li><a class="flex-next" href="#">Next</a></li></ul></div>
                                                                            <div id="carousel" class="flexslider">

                                        <div class="flex-viewport" style="overflow: hidden; position: relative;"><ul class="slides" style="width: 1200%; transition-duration: 0s; transform: translate3d(0px, 0px, 0px);">
                                                <li style="width: 89px; float: left; display: block;" class="flex-active-slide"><img src="http://spas-hammam.com/wp/wp-content/uploads/2014/05/gallery-31-111x69.jpg" alt="gallery-3" draggable="false"></li><li style="width: 89px; float: left; display: block;"><img src="http://spas-hammam.com/wp/wp-content/uploads/2014/05/gallery-11-111x69.jpg" alt="gallery-1" draggable="false"></li><li style="width: 89px; float: left; display: block;"><img src="http://spas-hammam.com/wp/wp-content/uploads/2014/05/gallery-41-111x69.jpg" alt="gallery-4" draggable="false"></li><li style="width: 89px; float: left; display: block;"><img src="http://spas-hammam.com/wp/wp-content/uploads/2014/05/gallery-5-111x69.jpg" alt="gallery-5" draggable="false"></li><li style="width: 89px; float: left; display: block;"><img src="http://spas-hammam.com/wp/wp-content/uploads/2014/05/gallery-6-111x69.jpg" alt="gallery-6" draggable="false"></li><li style="width: 89px; float: left; display: block;"><img src="http://spas-hammam.com/wp/wp-content/uploads/2014/05/gallery-7-111x69.jpg" alt="gallery-7" draggable="false"></li>                                            </ul></div><ul class="flex-direction-nav"><li><a class="flex-prev flex-disabled" href="#" tabindex="-1">Previous</a></li><li><a class="flex-next" href="#">Next</a></li></ul></div>
                                                                        </div>
                            </div> 

Answer 1

在你之前的问题中，有一个内联样式被应用到幻灯片容器中，它使整个滑块漂浮在左边。正因为如此，你需要确保滑块的宽度是100%，否则text-align:center;不会有任何效果。也可以尝试在.flex-active-slide中添加width:100%!important;。