问题标签 [vertical-rhythm]

我听说相对单位比绝对单位好，但有时浏览器会将其舍入错误并且很难计算。你知道任何可以提供帮助的工具吗？

我使用了 SASS/指南针。这很好而且很容易，但并不完美……</p>

第一次发帖，请温柔对待我:)

所以我尝试使用 Susy 并排放置两个按钮，这似乎工作正常：

但是，一旦我向按钮添加 1px 边框，有效宽度就是 100%+4px，因此它会破坏布局。

我对所有按钮填充值都使用了 Compass Vertical Rhythm 插件，所以不想搞砸。

任何帮助，非常感谢。

我有一个<tr>with 4<th>的内部和没有边界的<tr>and<th>的都是 22 像素高，这等于我的$base-line-height- 完美。

但是，当我添加' 时，+horizontal-borders(1px, 0)它<th>的显示高度为 23 像素，并消除了我的垂直节奏。

为什么会这样，我该如何解决？

在应用指南针垂直节奏模块时，有一件事情困扰着我，如果标题太长而无法放入一行，那么行高看起来太大了，因为它遵循 $base-line-height 变量的值。一般来说，我认为它应该更好地遵循经验法则：标题越大，行高越小。

我找到了一篇涵盖该主题的文章，建议在特定标题的字体大小上使用 $base-line-height。基于 adjust-font-size-to 和 adjust-leading-to 混合我创建了修改版本：

这是一个干净的修改吗？我对 adjust-headline-leading-to 中的 (if($relative-font-sizing, $to-size, $base-line-height)) 语句有疑问，基于：

小型测试用例的输出看起来很可靠，但想小心并询问在adjust-headline-size-to 和adjust-headline-leading-to 中是否有任何严重的明显错误？最好的问候拉尔夫

我有一个用 jQuery 编写的函数，可以自动执行表的margin-bottomor padding-bottom（有条件地）。基本上，它消除了表格单元格边框向下推动页面的效果，保持垂直节奏完整。我相信我应该能够使用 Less 和 CSS，而不是使用 JS 来做到这一点。

条件（if 语句）基于表中的行数（因此边框，再加一个）。由于我的“幻数”是 24（24px 是垂直节奏单位），如果表格有 (0,11)∪(24,35)∪… 边框，函数会做margin-bottom负数并将页面的其余部分向上拉. 但是，如果表格有 (12,23)∪(36,47)∪… 边界，它将添加到padding-bottom，将页面的其余部分向下推到下一个垂直节奏单元。这一切都是在假设表格中每个水平边框为 1px 的情况下运行的。如果您可以概括该模式以适用于较厚的边框，则可以加分。

这是我在 jQuery 中的函数：

到目前为止，这是我的 Less 中的内容：

帮帮我？

在使用 Chrome 开发网站时注意到以下行为：当我在页面完全滚动到底部时刷新页面时，我可以观察到垂直跳转。

请参阅以下Bootply。

要重现，请打开全屏预览（右侧的监视器图标），然后尝试以下操作：

1. 刷新页面（确认表单重新提交）--> 不跳转
2. 滚动到中间，刷新（确认表单重新提交）--> 不跳转
3. 滚动到最底部，刷新（确认重新提交表单）--> 垂直跳转

跳转实际上是由当页面包含带有.align-center类的图形时试图保持垂直节奏的 Javascript 引起的：

当然，删除这个 Javascript 也会删除观察到的垂直跳跃。我不明白的是，当 DOM 准备好时会应用填充，因此它不应该导致可见的垂直跳跃。我认为跳转与 Chrome 在页面滚动到最底部时处理视口的方式有关，但我真的不知道如何确认/确认这一点。

在 Firefox 或 Safari 中尝试此操作时，我没有观察到任何跳跃。

请问有什么想法吗？

编辑：我在 Chrome 的 bug tracker 上打开了一个 bug。

我正在学习 Compass，我对 2 个 mixin 有点困惑：adjust-leading-to和leader。有人可以告诉我它们之间的区别吗？

非常感谢你 ！

我得到了以下示例： http ://sassmeister.com/gist/fd882d54a8ad505e2188 基于这篇文章：

http://atendesigngroup.com/blog/vertical-rhythm-compass

.meta 元素之前的所有内容都处于完美的垂直节奏中。但是 .meta 元素不符合节奏。

我尝试了一些事情并设法将错误限制在

基本字体大小为 16 像素，从 16 像素到更多的所有内容都可以正常工作，但如果我的字体大小小于 16 像素，垂直节奏就会被破坏。

即使使用小于基本字体大小的字体大小，我如何才能实现完美的垂直节奏？

我有一个非常基本的问题来选择垂直节奏的填充大小。

让我们这么说：

我们有一个带有内容的 div（div 有一个边框）：

以下哪一项是垂直对齐的正确选择，这个：

还是我应该考虑差异 (18-14)/2 = 2px，所以：

或者如果两个答案都是错误的，请您解释一下如何解决这个问题。

到目前为止，我使用的是 Compass 0.12.x，并且我有一个可以工作的 mixin，用于为 Compass Vertical Rhythm 模块切换基线。当我尝试将该 mixin 应用到 Compass v1.0.1 时，两个基线的 line-height 保持不变。简化后的代码如下所示：

相应的笔是http://codepen.io/rpkoller/pen/lrBHK。Compass 1.0.1 中的结果代码是：

在 Compass 0.12.x 中是

那么是什么导致 Compass 1.0.1 返回相同的行高呢？四舍五入是没有意义的，因为如果您输入更多不同的行高值，例如 100 像素和 25 像素，则两个基线的输出仍然相同（请参阅http://codepen.io/rpkoller/pen/ qjdsa）。

更新： 好的，我终于弄清楚了。原来这种行为是由于 Sass 3.4 中引入的变化。您必须相应地更改 use-baseline mixin：