css - 使用 Rails link_to 和 font awesome gem 在 anchor 标记前添加空格

Question

出于某种原因，我无法将 CSS 应用于我的 link_to 以便为我的图标添加间距。

我在 Slim 中进行了以下设置:

.col-md-3.offset-md-6.something
 = link_to 'Sign In', 'www.website.com', target: '_blank', id: 'something', class: 'fa fa-lock btn btn-sign btn-md'

我试过以下方法:

#something a::before {
  content: 'f023 \00a0;'
}
.something a::before {
  content: 'f023 \00a0;'
}
.fa-lock {
  content: 'f023 \00a0' !important;
}

由于我使用的字体很棒，所以我无法定位我喜欢在其他地方引用的内容。

它在页面中实际显示的是:

<a target="_blank" id="something" class="fa fa-lock btn btn-sign btn-md href="www.website.com">
 ::before
"Sign In"
</a>

我什至尝试过使用:

= link_to ' Sign In', 'www.website.com'

这只是显示

& nbsp;Sign In

Answer 1

= link_to ' Sign In', 'www.website.com'

您正在传递要呈现的 HTML 实体。您必须对该字符串调用 html_safe:

= link_to ' Sign In'.html_safe, 'www.website.com'

关于应用 CSS - #something 中没有 a。有 a#something。您可以尝试将 CSS 应用于 before，方法是:

a#something::before {
  content: 'f023 \00a0;'
  // your custom CSS
}

希望对你有帮助。