bootstrap - 为什么我的行类不会扩展以适合我的固定大小的div?

时间:2015-03-10 02:31:59

标签: twitter-bootstrap twitter-bootstrap-3

好的,我在这里有一个有效的例子:http://www.bootply.com/16k8ngAUxF#

我的问题是:为什么我能清楚地看到div content2,而不是div content1?

<div class="container">

  <div class="row">
    <div class="col-md-2 hidden-xs">
    </div>
    <div class="col-md-10 col-xs-12" id="header-ads">
      <div>
        <div id="content1"></div>
      </div>
    </div>
  </div>

  <div class="row" id="header">

  </div>

  <div class="row">
    <div id="content2">
    </div>
  </div>

</div>

CSS

.container {
    background-color: lightgreen;
}
.row {
    background-color: pink;
    margin-bottom: 1px;
    border-bottom: 2px solid black;
  }
#content1 {
  margin: 4px;
  height: 40px;
  width: 40px;
  border: 2px solid lightblue;
  background-color: yellow;
}

#content2 {
  margin: 4px;
  height: 40px;
  width: 40px;
  border: 2px solid lightblue;
  background-color: yellow;
}

1 个答案:

答案 0 :(得分:1)

您的命名约定导致问题id="header-ads"这是广告拦截器阻止的众多类别之一。我目前正在使用adguard,请参阅下面插入我的网页<head>的css,您最有可能使用一些广告拦截器。

#googlead, #gridAdSidebar, #head-ad, #header-ads, #headerAd, #headerAdContainer, #header_ad, #homead, #ka_adRightSkyscraperWide, #leaderAd, #leaderBoardAd, #leaderboard-ad, #leaderboard-advertisement, #leaderboardad, #left-ad, #left_ads, #leftad, #leftads, #logoAd, #logo_ad {
display: none!important;
}