inFin-flex项目堆叠在FireFox中的按钮元素中

Question

我有这个使用inline-flex的例子：

button {
  display: inline-flex;
}

<button>
  <span>12</span>
  <span>asd</span>
</button>

问题在于，在Chrome中，跨度看起来彼此相邻，因为预期FireFox中它们是如何堆叠在彼此之上的。为什么FireFox没有像我期望的那样渲染（或者我的异常是正确的，而Chrome正在做一些奇怪的事情）？