html - Bootstrap : Row margins seen on smaller devices

Question

我的投资组合网站使用行来显示全 Angular 图像。这些在我的台式机和 iPad 上看起来不错，但一旦在手机上查看，左右似乎都有边距。

代码如下:

<section class="no-padding" id="portfolio">
    <div class="container-fluid">
        <div class="row no-gutter">
            <div class="col-xs-12">
               <img src="img/focus.jpg" class="img-responsive" alt="Focus Ireland"></a>
            </div>
        </div>   
     </div> 
</section>  

该站点的实时地址为 http://www.burnser.com/index.html

任何帮助将不胜感激。提前致谢。

Answer 1

Bootstrap 的 col-xs-12 类有一个填充。

padding-right: 15px;
padding-left: 15px;

在大于 768 像素的屏幕上，padding 设置为 0。

所以如果你想删除填充，你可以覆盖你的 css 文件中的那些属性。