在Twitter引导程序中添加导航栏下方的图像

时间:2012-12-15 13:33:42

标签: html css twitter-bootstrap

由于线路我正面临Bootstrap的问题:

<div class="navbar navbar-inverse navbar-fixed-top">
    <div class="navbar-inner">
        <div class="container">
            <a class="brand" href="/"></a>
        </div>
    </div>
</div>

<div id="main_top">
    <div class="container">
        <div class="row">
            <div class="span12">
                            ...

在main_top中我有一张背景图片。由于以下代码我调整浏览器大小时会出现问题:

@media (max-width: 979px)
.navbar-fixed-top {
margin-bottom: 20px;
}

基本上,当浏览器宽度< 979,由于20px的余量,有一条白线。

你可以帮我解决一下吗?我还在这里创建了一个示例:http://jsfiddle.net/TxRgF/

2 个答案:

答案 0 :(得分:1)

Working DEMO

这个怎么样:

@media (max-width: 979px){
    body{
      padding-left:0 !important;
      padding-right: 0 !important;
    }

   .navbar-fixed-top {
      margin-bottom: 0px !important;
   } 

}

答案 1 :(得分:0)

在那个宽度处,身体有左右填充。在CSS的末尾添加此类。

@media (max-width: 767px){
  body {
   padding-left:0 !important;
   padding-right: 0 !important;
 }
}

http://jsfiddle.net/simply_simpy/ryjMT/2/

您需要向其他元素添加填充以进行补偿。