Bootstrap 3网格

时间:2016-02-20 13:30:47

标签: css twitter-bootstrap-3

有人可以帮我删除网站最右边的额外空格(列)。我在wt-col-sm-3,wt-col-sm-6,wt-col-sm-3列上划分了行,但是我想删除一个额外的白色列空间。我尝试了很多选项并改变了css。但似乎没有任何工作。

<div id="slider_row">
    <div class="container">
        <div class="row">
            <!-- Module Megamenu-->
            <div id="wt-menu-ver-left" class="wt-menu-ver-left wt-col-sm-3 wt-col-md-2">
                <div class="title-menu-mobile category-title"><span>Category</span></div>
                 <div class="category-left" style="display: block;">
                    <ul class="menu-content">
                        <li class="level-1  parent">
                            <!-- All categories listings mobiles and accessories,tablets,laptops,Desktops &Monitors,Laptop Battery & charger -->
                        </li>
                    </ul>
                 </div>
            </div>
            <!-- /Module Megamenu --><!-- Module HomeSlider -->
            <div id="slider-wrapper" class="wt-col-md-6 wt-col-sm-6">
                <div id="layerslider" style="visibility: visible; width: 538px; height: 395.588px;" class="ls-container ls-v5">
                    <!--Mac book advertisement contents -->
                </div>
            </div>
            <!-- /Module HomeSlider --><!-- Static Block module -->
            <div id="slider-wrapper" class="wt-col-md-3 wt-col-sm-3">
                <p><img src="http://www.m.com/img/cms/freedel.jpg" class="img-responsive" alt="Free Delivery" width="200" height="174"></p>
                <p><img src="http://www.m.com/img/cms/GENUINE PR.png" class="img-responsive" alt="100% Genuine" width="200" height="144"></p>
                <p><img src="http://www.m.com/img/cms/pay1.png" class="img-responsive" alt="Payment Methods" width="200" height="157"></p>
            </div>
            <!-- /Static block module -->
        </div>
    </div>
</div>

1 个答案:

答案 0 :(得分:0)

一个。你没有以适当的方式分发你的列,因为对于中等设备你有wt-col-md-2 + wt-col-md-6 + wt-col-md-3,而基于12个网格布局系统的中等设备给出11而不是bootstrap。因此,您可以尝试这样做:

wt-col-md-2 + wt-col-md-7 + wt-col-md-3

wt-col-md-2 + wt-col-md-8 + wt-col-md-2

填充行的整个宽度。

B中。我注意到wt-grid.scss文件中列的宽度计算错误,因为两列布局wt-col-md-2的宽度为19.14529%,如果将它乘以6以获得12列布局,则会有114.87%而不是100%。此外,我没有找到wt-col-md-6wt-col-md-7类的宽度,但它们缺失了。

http://screencast.com/t/D9elhv9n

http://screencast.com/t/shwRKflSUq6

祝你好运!