打开时，Chrome选择框选项文本会失真

Question

在我的Chrome版本37.0.2062.120中打开时，选择框中的选项标签之间的文字无法正确呈现。

请参阅随附的屏幕截图，以清楚地说明问题。

当我选择一个选项并从框中移开时，选择了正确的选项，并在关闭选择框时正确渲染。

我在Canary 39.0.2161.0和FF中对它进行了相同的测试，它正确渲染而不会失真。

我之前没见过任何类似的东西。

与Chrome最近的字体渲染更新有什么关系？

非常感谢任何帮助。！

链接到页面，表单位于底部：http://dev.emarkadvantage.com/strategy.php

更新：对我有用的修复方法是将SVG字体的位置向下移动到@ font-face堆栈。

Answer 1

我之前有这个。使用标准（即非网络）字体进行选择。我不知道为什么网络字体会导致问题......但他们确实存在问题。

另见this answer。

Answer 2

您应该在select标签上添加课程

  

类=＆＃34;形状控制＆＃34;

<select id="category" class="form-control">
     <option value="">Your top callenge today?</option>
     <option value="Sales">Sales</option>
     <option value="Competition">Competition</option>
     <option value="Marketing ROI">Marketing ROI</option>
     <option value="Positioning">Positioning</option>
</select>