我尝试使用@include span-columns mixin实现四列行:
div.people {
@include outer-container(80%);
.researchers {
@include span-columns(12);
text-align: center;
}
.researcher {
@include span-columns (3 of 12);
@include omega(4n);
}
}
我的html-markup看起来像这样:
<div class="people">
<header>
<h1>PEOPLE</h1>
</header>
<div class="researchers">
<div class="researcher">
<a href="/veerle-buffel.html">
<%= image_tag "sarah-van-leuven.jpg" %>
<p>Veerle Buffel<br>Doctoral researcher</p>
</div><!-- .researcher -->
<div class="researcher">
<a href="/elise-rondelez.html">
<%= image_tag "sarah-van-leuven.jpg" %>
<p>Elise Rondelez<br>PhD researcher</p>
</div><!-- .researcher -->
...
</div><!-- .researchers -->
</div><!-- .people -->
但是我只获得了两列,而不是四列:
我该如何解决这个问题,所以每行得到4个元素而不是2个。
感谢您的帮助,
安东尼