如何制作标志(使用flag-icon-css)填表格单元格？

Question

我在flag-icon-css网站上使用.

这是生成的HTML表格行:

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/flag-icon-css/2.3.1/css/flag-icon.min.css" rel="stylesheet"/>
<table class="table">
  <thead>
    <tr>
      <th class="text-center">Location</th>
      <th class="text-center">Number</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td class="text-center"><span class="flag-icon flag-icon-us"></span></td>
      <td class="text-center"><a class="btn btn-primary" href="/view?+16466635449">(646) 663-5449</a></td>
    </tr>
  </tbody>
</table>

这是一个截图:

我怎样才能使旗帜更大,看起来更正常,根据flag-icon-css它应该以这种方式自动表现？

寻找不使用自定义CSS的解决方案.

这个网站正在使用Bootstrap.

Answer 1

如果您仍然在这里..您应该使用flag-icon-background代替flag-icon并将其添加到父级，这是您的情况<td>：

<td class="flag-icon-background flag-icon-us"></td>

这是完整的例子：

<td class="flag-icon-background flag-icon-us"></td>

Answer 2

据我所知，你可以flag-icon在 CSS 中定位类并添加font-size，它会使标志更大。