0

在一个带有 Zen 子主题的 Drupal 站点上工作时，我放弃了 zen-grids 来使用 susy。我一直在和 Susy 一起玩，效果很好。但这是我的问题。

我有一个包含两个主要列的布局：#content（包含主要内容；由三行四个图像组成的网格，宽度为 181 像素）和div.region-sidebar-second（包含主导航）。

我的设计师提出了一个 960 像素的布局，其中 #content 容器的宽度为 750 像素，右边距为 8 像素，而 div.region-sidebar-second 的宽度为 202 像素。

在我的 responsive.scss 我放：

.sidebar-second {
#content {
@include span-columns(9, 12);
}
.region-sidebar-second {
@include span-columns(3 omega, 12);
}
}

所以 #content 使用前 9 列，而 .region-sidebar-second 使用最后 3 列。但这并不能转化为 750px/8px/202px。

susy 计算的百分比当然是正确的，但是对于我的布局，我需要 Susy 来计算不同的百分比。

例如，Susy 计算#content

.sidebar-second #content {
float: left;
margin-right: 1.40845%;
width: 74.6479%;
}

并且对于

.sidebar-second .region-sidebar-second {
float: right;
margin-right: 0;
width: 23.9437%;
}

为了满足设计要求，我需要一个宽度：#content 为 78.125%，margin-right 为 .833333%，.region-sidebar-second 为 21.0416666%

不确定这是否可以通过 Susy span-columns 实现。如果您有一个快速的想法，这将非常感激。谢谢。

4

0 回答 0