【魔改经验分享三】一条语句搞定“图片无法撑满，左右都有空白”

前言

上一篇 【魔改经验分享一】去bootsnipp挑双水晶鞋，让你的网站瞬间麻雀变凤凰！ 小伙伴们试过了，都说好。
但是，图片左右有空白，无法填满，如下图：

白边1.png

在我试了一圈margin， padding，效果不佳之后，猛然回头，伊在灯火阑珊处：
在【魔改加餐】提升网页颜值的3个小妙招 里面，助教大人提到：

row.png

把

   <%= render "common/navbar" %>
替换成

   <div class="row">
     <%= render "common/navbar" %>
   </div>

说明：这是因为我们的 layout 里用到了 container-fluid 这个 class ，它默认会把左右两边的 padding 撑开15px，而 row 这个 class 则是带有左右 负15px 的 margin ，这样就可以抵消掉外面的两个padding 了。

所以 用row tag 把slider包起来即可。

  <div class="row">

  <div id="bootstrap-touch-slider" class="carousel bs-slider slide  control-round indicators-line" data-ride="carousel" data-pause="hover" data-interval="5000" >
...
</div>
  

赶快把这个bug解掉吧！

如有问题，请直接留言。
喜欢我分享，可以去我的网站奇妙工作网.
http://qimiao.herokuapp.com/, 看看效果！ ^_.
喜欢我的设计，请投我一票，你的鼓励，如冬日初升的太阳，温暖感人。

投票.png

喜欢我的文章，请关注我的微信公众号 爱莉莎的雪月花。

mini_爱莉莎的雪月花.png

谢谢你的阅读。