Chrome中的跨度渲染错误？

Question

我在macOS上遇到Chrome问题，在span中向div中的文字添加span标签会影响字词之间的间距，有时会影响换行符。

我认为，无格式div标记不应更改文本呈现，并且除了添加跨度之外，具有相同内容和样式的两个相同div应该呈现相同的内容。这似乎并非如此，可以在下图中看到。重叠两个div以显示呈现差异，其中前面带有红色文本的span的蓝色为div，后面带有黑色文本的div不

这可能看起来很小，但在某些情况下，这种差异正在影响线路断线的地方（虽然非常罕见且难以复制）。这可以在下一张图片中看到。

我已经设置了一个JSBin来演示添加span标签时的区别。缓慢调整HTML输出面板的宽度，您应该看到两个div的渲染中存在差异。将宽度移动到658px以查看换行问题。

https://jsbin.com/qajekub/edit?html,css,output

所以我的问题是，为什么两个相同的span之间存在对齐差异，但有一个<form class="" action="captcha_validate.php" method="post"> Captcha Verify: <input type="text" name="captcha" value="" /><br /><br /> <img src="captcha.php" /><br /> <input type="submit" name="submit" value="Submit" /> </form> s？有什么我想念的吗？一个CSS属性或默认样式会导致这个？

这发生在macOS上的Chrome 55中。据我所知，它不会出现在Firefox或Safari中，我无法在其他操作系统上进行测试。