祖尔布基金会块网格缺失单元格

Zurb-Foundation block grid missing cell

本文关键字：单元格 网格 基金会      更新时间：2023-09-26

我使用Zurb基金会块网格布局并遇到一个问题。
我有这个代码和 Ember.JS 

<div class="row">
    <ul class="small-block-grid-2 large-block-grid-5">
         {{render Ember.JS View}}
    </ul>
</div>

余烬产生 7 个<li>元素，它们看起来像
http://jsfiddle.net/67obcg00/但是，在页面上，整个网格向右移动。因此，第一行中的第一个单元格为空，第二个单元格li包含 #1 的 7。
最终，最后一行包含两个单元格，而不是一个单元格。

有什么建议吗？
谢谢。

这是一个使用 Ember 1.7 和 Zurb 4.1.6 的工作 jsbin

。

还有一个使用 Ember 1.9 beta、Handlebars 2.0 和 Zurb 5.4.7 的 jsbin 版本

使用 css 选择器[:nth-child][3]和 pre ember.js 1.8 时面临的问题是 ember 使用的元形态标签知道它负责更新 DOM 的哪些部分。第 n 个子选择器会将样式应用于脚本标记以及列表元素。

<ul class="small-block-grid-2 large-block-grid-5">
    <script id="metamorph-10-start" type="text/x-placeholder"></script><script id="metamorph-2-start" type="text/x-placeholder"></script>
   <li><img src="http://placehold.it/395x590" data-bindattr-287="287"></li>
   <script id="metamorph-2-end" type="text/x-placeholder"></script><script id="metamorph-3-start" type="text/x-placeholder"></script>
</ul>

使用 css 选择器 ：nth-of-type 将只应用于指定类型的样式。

干杯，我希望这有所帮助。

相关文章：