Chrome和Mobile无法呈现与Firefox - Bootstrap相同的结果

Question

我在容器中有一个输入字段，一切都在Firefox中正常工作但是当我在移动设备上测试它时（Chrome和Safari），文本字段重叠在右边。我在Chrome桌面上遇到了同样的问题。

我尝试使用clearfix但它没有用。

我知道使用Webkit对我的代码应用了哪些更改可以实现这一点？

这是我的代码：http://codepen.io/anon/pen/cAqyo

重置是否有效？我以为Bootstrap有一个包括在内但也许还不够。

TL; DR

适用于Firefox，但不适用于Chrome和移动设备 http://codepen.io/anon/pen/cAqyo

Answer 1

如果你改变了

box-sizing: content-box;

到

box-sizing: border-box;

<。>在.fancy-input类中，它可以在Chrome中正常运行。