Question

我有一个主内容div，嵌套内容和侧边栏div。我的内容部分是背景颜色，我想一直走到屏幕的左边，但是停在我按列设置的位置，即8点。

<div id="main-content">
  <div class="container">
    <div id="content">
    </div>
    <div id="sidebar">
    </div>
  </div>
</div>

#content { 
  @include span-columns(8, 12);
  background-color: rgba(0, 0, 0, .5);
}

#sidebar { @include span-columns(4 omega, 12); }

我尝试了Bleed mixin，给它类似10000px的东西，但是我把所有内容都搞定了。我能做些什么来实现我的目标？谢谢！

Answer 1

哦，我明白了。我可以想象有几种方法可以做到这一点，但所有这些方法都需要一些创造力。旧（原始）Susy站点实际上使用出血方法创建了此效果。这将是这样的：

.container { @include container; }

#content {
  @include span-columns(8, 12);
  @include bleed(200%, left);
  background-color: rgba(0, 0, 0, .5);
}

#sidebar { @include span-columns(4 omega, 12); }

您对这种方法有什么问题？

让背景扩展到容器之外的诀窍是什么？

1 个答案: