问题标签 [susy-compass]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
319 浏览

compass-sass - Susy:元素在根上下文中的定位

这是我第一次使用 Susy。我真的很喜欢我在文档/教程中看到的内容,但是在我的一些第一次布局尝试中遇到了一些意想不到的结果。

版本信息:

下图显示了我使用教程html 和 screen.scss 逐字获取的结果:

为什么_is_the_h1_off_the_grid_somewhat

如您所见,检查 h1 元素显示它位于网格之外。这是正常的吗?

0 投票
1 回答
2006 浏览

symfony - 将 Susy 与 Compass 一起使用 - 应安装哪些文件?

我正在尝试使用 Susy 作为项目中的网格元素

http://susy.oddbird.net/

仅供参考,我也在使用以下库

  • 罗盘
  • 资产
  • Symfony (2.x)
  • Ubuntu (10.4)

当我尝试在我的 sass 文件中导入 susy

我确定这是因为 compass 无法找到要包含的 susy 文件。安装成功的人可以告诉我这些susy文件应该放在哪里吗?使用 gem 安装程序安装 compass-susy-plugin 后,我可以看到以下内容...

它似乎只是将 susy 文件保存到示例文件夹中 - 它是否也应该将它们复制到“框架”或libs文件夹中(它没有)?

或者上述是否正确 - 在这种情况下,指南针文件中的“导入”减速与(来自文件系统 POV)sass 文件本身有何关系?

顺便说一句:除了这个问题,一切都很好。

PS 如果代表超过 1500 的人想要创建两个新标签,则应将“Assetic”和“Susy”附加到此帖子

0 投票
1 回答
1903 浏览

sass - 无法让基于 Susy 的网格正确对齐

我一直在尝试Compass ( SASS ) 的Susy插件,但我注意到它没有按我的预期工作。

我从官方的 Susy 教程index.html中获取了和,编译了 SCSS 并将它放在我的服务器上。如您所见,它看起来就像它应该的那样(在我测试过的所有浏览器上):screen.scss

在此处输入图像描述

我接下来要做的是:

  • 复制<article><div role="main">粘贴六次
  • screen.scss中,相应地更改列跨度 ( div[role="main"] > article):从@include columns(6,9);@include columns(1,9);

但是现在这些新元素根本不与网格对齐,它们被一个清晰可见的空间隔开。我在最新版本的 FF、Safari 和 Chrome 中对此进行了测试,似乎只有 FF 可以正确显示。屏幕截图来自 Chrome:

在此处输入图像描述

我这里也上传了源码供大家查看。

这是 Susy 的普遍问题,即网格不正确还是我做错了什么?如果是第一个,有人知道解决方法吗?我也尝试了百分比和像素,但都没有奏效。

0 投票
1 回答
140 浏览

css - 如何在 Susy 网格项目中执行预定义的 CSS 文件?

我是 susy 网格的新手。谁能告诉我如何在我的 susy 网格项目中实现预定义的 css 文件?我正在使用指南针插件。

0 投票
1 回答
1805 浏览

css - susy:根据屏幕大小改变列数

在 Compass/Sass 插件Susy中,您可以设置 _base.scss 文件中的列数。

对于桌面视图,我喜欢有 12 列。但是,对于移动视图来说,这列太多了。有没有办法更改移动显示的列数?

(我正在做一个响应式网页设计,所以网站的桌面版和移动版都将共享同一个 _base 文件)。

谢谢!

0 投票
2 回答
3312 浏览

css - Susy:susy-grid-background 总是显示 12 列,无论 $total-cols 否

来自 Susy 文档:http ://susy.oddbird.net/guides/reference/#ref-grid-background

SUSY 网格背景
将 Susy 网格显示为任何容器上的背景图像。

// susy-grid-background(); .page { @include susy-grid-background; }

如果您将元素用作容器,则需要为元素应用背景以使此网格背景正确调整大小。

我的CSS片段:

在我的 Haml 中:

无论我尝试过什么,网格总是显示 12 列。有人会好心地指出我需要去让这个调试工具工作的方向吗?

苏西 (1.0.rc.1) 指南针 (0.13.alpha.0)

0 投票
1 回答
1793 浏览

css - 在 Compass Susy 中组合布局断点?

我只是想使用 Susy

我已经定义了布局,我需要从桌面版本开始,然后再添加 2 个:一个用于平板电脑,一个用于手机:

似乎正在工作。当我需要对应该出现在桌面上而不是其他两个中的任何内容进行更改时,我的问题就出现了,我发现自己在重复自己:

我怎样才能简化这个?

0 投票
1 回答
4033 浏览

css - Susy:如何扩展内容框以覆盖网格填充?

我刚开始和苏西一起玩。我有一个 12 列网格,上面有网格填充。现在我希望我的页面标题跨越整个网格,包括网格填充。我现在正在做的是计算整体宽度,然后在标题上设置负边距。这对我来说感觉相当hacky......有没有更清洁的方法呢?

0 投票
1 回答
1650 浏览

ruby-on-rails - 使用 ruby​​ on rails 安装 Susy 和 Compass

我刚从 ruby​​ on rails 开始,我尝试做的第一件事就是安装 gems compass 和 susy。在弄清楚我需要将它们包含在 gemfile 中之后(我正在使用 RubyMine 并认为它会为我做这件事),当我尝试将 susy 导入到我的 css.scss 文件之一。

我有 ruby​​ 版本 1.9.3 (194)

和红宝石宝石版本 1.8.23

非常感谢我在我的包中需要哪些 gem(和版本),如何确保它们进入项目包中的任何帮助。

0 投票
1 回答
5075 浏览

sass - Susy grid - 任何(简单?)方法可以使“列”具有相同的高度?

用 Susy/sass/haml 等弄湿我的脚(使用调整后的中间人 - 来自 master 分支的最新 susy)

在 grid.css.scss 中有这个

此片段来自 site.css.scss

.body 背景是黑色的...

现在,当 main-left 中的内容大于 main-right 时,我会在右下角看到一个黑色方块...无论如何我都可以使右下角 #eee iow main-right 与 main-left 具有相同的高度(动态)-或者有.main 背景来申请......???

谢谢

彼得

PS拥有更多学分的人应该在stackoverflow中制作一个Susy标签......