由于解释起来有点困难，我做了一个模型来尽可能地直观地理解：

http://sassmeister.com/gist/70624a740b1ca4ae7764

（如果有更好的方法来分享一个 sass gist，请告诉我。第一次使用它）

基本上，这是我想要的横向模式平板电脑的布局。我要做的是确保它完全适合具有不同纵横比的不同平板电脑。有些事情是固定的。主要内容区域是 16x9 视频，因此该方面被锁定。

我现在已经修复了页眉和页脚（仅限主列），因为它们需要用于纵向模式，但如果它有助于平板电脑景观，我可以将它们带入常规流程。无论如何，它现在都是通过 susy2 进行的基本响应，并且侧边栏是完全独立的，因此它可以独立于主要内容滚动。我想要的是整个主要区域（包括页眉和页脚）与 vid 上方和下方的均匀边距完美匹配，然后让侧栏列更改其宽度以匹配平板电脑。

所以......如果平板电脑更宽，预告片缩略图将达到 16x9 的比例。如果数位板较窄，主列保持不变，但预告拇指会缩小为正方形。

如果首先弄清楚如何响应地仅缩小右列更容易，那么拇指的方面没有变化，那没关系。我只是不希望整体布局因为纵横比而在一个设备和另一个设备上搞砸了，所以主要关注的是页眉在顶部，页脚在底部，主视频完全适合它们，然后侧边栏响应填充其余的（在合理范围内）。

感谢任何输入。第一次在这里做网站，有很多东西要学。

附言。我为右列启用了垂直滚动，但禁用了它（通过向 scss 列中的滚动类添加额外的字母），因为它实际上并没有让我滚动。不确定这是否是因为没有实际内容，或者它没有将空填充单元格识别为值得滚动的内容。

Need assistance with getting gulp/gulp-sass to recognize susy. Im running out of ideas and need a 2nd set of eyes. Thank you for feedback.

Error:

gem list

Config.rb

Gemfile

Gulp

抱歉，如果在文档中遗漏了，但 Susy2 可以用于 IE8 用户使用 respond.js 或其他技术，即仅强制桌面视图，谢谢！

I'm not understanding how Susy calculates widths for it's grids. I have a 9 column grid which is nested inside a 12 grid column and the widths aren't calculated as I would expect them to be. Here are my settings:

So my main column has @include span(last 9 nest);. So inside that 9 column grid cell if I create another cell using @include span(1 of 9 inside); shouldn't the output css be:

Instead what I'm getting is:

What I want is the total column width to be 60 pixels, which is what I expect a single column width to be, and then add padding on the left and right. Is there a way to tell Susy not to add the width to the column width? Also I using padding instead of margin because I need the columns to be flush with each other.

Here's a screenshot of what the grid needs to look like.

1. 我没有使用指南针
2. 我更喜欢使用 Breakpoint.scss
3. 我在 susy 2.0

我知道有很多关于这个问题的帖子，但我没有运气找到任何关于这个主题的内容Breakpoint.scss。Susy 2.0

我必须使用susy-breakpoint还是可以实现这样的目标？我想要 6 列在 800 像素/以下，12 列在/800 像素以上

我试图保持干燥，所以在我的样式中添加一个 susy-breakpoint 并没有帮助。

我也尝试过下面的代码，但我认为我只是在某处出现错误，因为它无法正常工作。

我想要一个像http://www.mattk.com上的网格布局

对我来说，看起来 3 个区域有一个最大宽度，两个区域跨越整个屏幕。有没有办法让容器有一个最大宽度，但是有几个区域超过了这个？

我一直在拔掉我漏掉的头发。我这周刚下载了 Codekit，想用 Compass/SASS/Susy 重新设计我自己的网站。我已经尝试了几种方法来让它工作，Codekit 中的首选项指向可执行路径。我很高兴能开始这项新的尝试，但我似乎无法通过设置。任何帮助将不胜感激！谢谢。

我已经开始使用 Thorax，并且我已经使用 yeoman 的 thorax 生成器来设置 webapp：

我选择了 SASS 作为 css 预处理器，然后我可以在使用grunt命令构建它之后成功运行我的 webapp。

现在我的问题是我不确定如何将 susy 添加到我的 Gruntfile.js 中。文档声明您应该添加require: 'susy'到 SASS 选项参数。

但是我的 Gruntfile.js 中没有 SASS 选项，我尝试将其添加到其中 - 但是当我添加@import "susy";到我的 css/base.scss 文件时它不起作用。

有没有人成功地将 susy 添加到胸部应用程序中？

编辑 我也尝试通过凉亭添加 susy。

然后我就可以做@import "../bower_components/susy/sass/susy";但是，将 susy 添加到 gruntfile.js 中的 SASS 选项中会很好，并且能够做到这一点@import "susy";。

我想将 susy 用于一家大公司的项目。他们想知道 susy 在哪个许可证下。你能给我一些信息吗？我无法通过检查github repo或查看网页来找到该问题的答案。

在 susy one 中，定义元素根据全局变量改变宽度的范围非常容易。我正在尝试学习 Susy 2，但无法真正理解它如何与断点集成一起工作。

我在这里做了一些伪代码来指出我想要存档的内容

Susy SASS 地图

一个html元素

结果我想要.foo

• 小 = 50%（减去一些排水沟）
• 中等 = 33,3333%（减去一些排水沟）
• 大 = 50%（减去一些排水沟）

你如何归档这个？我看过几个教程，但他们没有谈到这一点。这个问题谈到了类似的事情。是否有可能我们必须不断地告诉 Susy 使用哪种布局？我们当然可以说x **of** something，但我发现只在全局范围内定义网格并跳过所有时间非常方便。