调整

时间:2016-06-02 17:33:39

标签: html css twitter-bootstrap

全屏查看时,侧边栏显示正常。当我开始使屏幕变小时,侧边栏然后与另一个容器重叠。我试图摆弄引导代码,但我被卡住了 - 任何人都可以建议我应该改变什么吗?

Normal

Overlapped

<div class="col-xs-10 col-xs-offset-1 col-sm-2 col-sm-offset-1 blog-sidebar">
          <div class="sidebar-module sidebar-module-inset">
              <a href="https://www.facebook.com/womendigitalnomads/" target="_blank" class="btn-social btn-facebook"><i class="fa fa-facebook"></i></a>

              <a href="https://www.instagram.com/womendigitalnomads/" target="_blank"><img src="images/homepagebanner.jpg" class="img-responsive" alt="Instagram"></a>
    </div>
        </div>

CSS

.sidebar-module {
  padding: 15px;
  margin: 0 -15px 15px;
    border-left: solid 1px #e1e1e1;
}

.sidebar-module-inset {
  padding: 15px;
  border-radius: 4px;
}
.sidebar-module-inset p:last-child,
.sidebar-module-inset ul:last-child,
.sidebar-module-inset ol:last-child {
  margin-bottom: 0;
}

1 个答案:

答案 0 :(得分:0)

尝试在.sidebar-module

上使用%with width

也许它正确调整大小