CSS Fontawesome Icon点击IE 10中的能力

时间:2016-12-22 10:53:35

标签: html css internet-explorer font-awesome

我在css中添加了Fontawesome Icon以在选择Dropdown中显示它 现在我无法点击IE 10中的Fontawesome图标,任何人都知道如何解决这个问题

HTML

<div class="select">
  <select>
    <option value="">Order By</option>
    <option value="1">ID</option>
    <option value="2">Details</option>
  </select>
</div>

CSS

.select {
  position: relative
}

.select select {
  -webkit-appearance: none;
  -webkit-border-radius: 0px;
  -moz-appearance: none;
  appearance: none;
  border: 0;
  background-color: #e5e5e5;
  height: 30px;
  padding: 0 20px;
  width: 100%;
  position: relative;
  margin-bottom: 0;
}

.select select::-ms-expand {
  display: none;
}

.select:after {
  content: '\f0d7';
  font-family: 'FontAwesome';
  font-size: 16px;
  color: #000;
  position: absolute;
  right: 15px;
  top: 6px;
  pointer-events: none;
}

Fiddle

1 个答案:

答案 0 :(得分:0)

如果您希望在下拉列表中的现有元素旁边显示icons,则必须在 HTML 元素旁边添加它们。这意味着,您必须在下拉列表元素旁边添加特定的 FontAwesome icon才能显示。如果这是你的问题。

像这样; <option value=""><i class="fa fa-your-content"></option>

否则无论你怎么努力都不会显示。

此外,您是否已链接到 FontAwesome 源或 CDN ?因为没有源代码,您无法显示任何自定义元素。