css - Foundation Icon 字体未正确调整大小

Question

我已经使用“foundation-icons-sass-rails”gem 成功地让我的图标显示为链接，但是当我在我的 CSS 中尝试这些解决方案时，它们没有调整大小:

.fi-heart {
  font-size: 72px;
 }

在我的 index.html.erb 中，它们看起来像这样:

 <div class="row">
 <% @pets.each do |pet| %>     
  <p class="button-left">
   <%= link_to pets_path do %>
     <i class="fi-paw large"></i>
   <% end %>
 </p>
 <p class="button-right">
   <%= link_to pet_friendships_path(pet), method: :post do %>
     <i class="fi-heart large"></i>
   <% end %>
 </p>

更新:结束引用 this solution来自 FontAwesome 的引导图标问题并使其正常工作。

 <div class="row">
  <% @pets.each do |pet| %>
   <div class="button-left">
    <div style="font-size: 42px">
     <%= link_to pets_path do %>
      <i class="fi-paw"></i>
    </div>
   <% end %>
  </div>

Answer 1

我有同样的问题，添加小中型或大类不起作用。我将以下代码添加到我的 CSS 中以使其工作。

i.small  { font-size: 0.8rem; }
i.medium  { font-size: 1rem; }
i.large  { font-size: 1.2rem; }

希望对您有所帮助。