【问题标题】:How to set a margin between nested grids/ rows element in Susy 2如何在 Susy 2 中的嵌套网格/行元素之间设置边距
【发布时间】:2015-10-28 17:41:23
【问题描述】:

我尝试实现一个非常简单的 HTML 结构来显示 cmets:头像显示在评论文本的左侧,如下所示:

<div class="comment">
     <div class="comment-avatar"><img src="..." /></div>
     <div class="comment-text">Some comment text</div>
</div>

我正在使用 Susy 进行布局:

.comment-avatar {
    @include span(2);
}

.comment-content {
    @include span(10 last);
}

我的问题:我想在彼此之间留出评论空间,所以我设置了

.comment {
   margin-bottom:70px;
}

但这并不有效:有时会尊重边距,但当评论文本很长时,不会尊重边距(参见http://codepen.io/anon/pen/QjrrqP,拉丁文本和评论文本2之间)。

任何建议都会非常有用!

【问题讨论】:

    标签: css susy-compass susy grid-system


    【解决方案1】:

    您需要 comment 包装器来清除它的浮动内容。 Susy 有一个 clearfix,如果你没有自己的,你可以使用:

    .comment {
      @include susy-clearfix;
      margin-bottom:80px;
    }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2023-03-07
      • 2013-03-24
      • 2015-02-09
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2020-11-25
      相关资源
      最近更新 更多