我正在为一个新的drupal站点使用zen grids进行试验,我正在使用zen starter主题工作。假设我有一个5列的网格,其中有一个无序列表,其中有5个列表项。在我的scss文件中,我想说让每个<li>都有一列宽,第一个列表项没有左边界,最后一个列表项没有右边界。
我看过zen-grid-item和zen-grid-flow-item混合,但我还没能做到这一点。谁能给我举个简单的例子?下面是一些示例标记
<ul>
<li>First</li>
<li>Second</li>
<li>Third</li>
<li>Fourth</li>
<li>Fifth</li>
</ul>
ul {
$zen-column-count: 5;
$zen-gutter-width: 30px;
@include zen-grid-container;
li {
/* Not sure what to put here to make each <li> 1 column wide */
}
}发布于 2013-08-29 21:54:44
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
<li>9</li>
<li>10</li>
</ul>
ul {
$zen-column-count: 5;
$zen-gutter-width: 0;
@include zen-grid-container;
background: #eee;
width: 70%;
margin: 0 auto;
li {
@include zen-grid-flow-item(1, 5);
@include zen-float(left);
height: 100px;
border: 1px solid #fff;
}
}https://stackoverflow.com/questions/16535719
复制相似问题