字体真棒图标对齐

时间:2012-09-08 10:47:10

标签: css ruby-on-rails twitter-bootstrap sass font-awesome

我正在使用bootstrap-sass和font-awesome-sass-rails gems,并通过添加到bootstrap-and-overrides.css.scss成功消除了重复图标(来自glyphicons):

[class^="icon-"] {
  background-image:none;
}

然而,现在我遇到的问题是略有不合格的图标..这些字形完美之前。现在我看到了:

enter image description here

我想将图标向下移动一个像素或2.请帮忙。感谢。

2 个答案:

答案 0 :(得分:0)

类似于在Font-Awesome Integration section上找到的LESS的指示,应该完全删除字形图标的SASS,而不是仅仅在其上加载字体 - 令人敬畏的SASS。我强烈反对任何只是试图通过覆盖首先不需要存在的CSS规则来保存外观的方法。

我不使用Rails,但我认为粗略的轮廓将是:

  1. 查看bootstrap-sass repo

  2. 的副本
  3. 找到 _bootstrap.scss 文件。

  4. @import "bootstrap/sprites";替换为@import "your/path/to/font-awesome";,其中your/path/to/包含 font-awesome.scss

  5. 重新编译 bootstrap.scss (不要忘记缩小!)。

答案 1 :(得分:0)

我正在使用twitter-bootstrap-rails gem。我不得不发表评论:

  @iconSpritePath: asset-path("twitter/bootstrap/glyphicons-halflings.png");

来自bootstrap_and_overrides.css.less文件