我使用Semantic.gs作为我的网格系统。我正在按照嵌套列示例来尝试创建我想要的内容,同时尽可能地遵循网格。给定来自 Semantic.gs 的嵌套列示例代码:
HTML
<article>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
</ul>
</article>
较少的
article {
.column(9);
ul {
.row(9);
li {
.column(6,9);
}
}
}
我的问题是,在尽可能遵守网格系统(semantic.gs)的同时,向嵌套列的父级添加填充(理想情况下与排水沟宽度相同)的最佳方法是什么?请注意,我使用的是 960px 的固定布局。
这是我尝试在米色父元素上使用左右填充来实现的示例(Photoshop,不完全根据上面的代码)图像:
更新: 按照桑迪普斯的例子,我能够做到这一点,但我没有提到我使用的是 960px 网格。这是我的结果:http ://bit.ly/M5fr5N 。