Chrome正在剪切文本输入内容

Question

我有以下内容：

    <form>
        <span>
            <input
                placeholder="03/10/2016 - 04/12/2016"
                type="text"
                readonly />
        </span>
     </form>

在Chrome中，此内容会被剪裁，但在Firefox和Safari中则不然。就像这个例子一样简单，我无法弄清楚如何使文字不在Chrome中剪辑。两种浏览器的内容宽度计算方式不同。

编辑：根据其他用户的评论，Chrome中的小提琴看起来不错，也许值得注意的是我在Mac OSX上。

这是一个演示问题的小提琴： https://jsfiddle.net/danallen88/whk64gyn/

截图：

Firefox：

Chrome：