空格：pre和flexbox

Question

我希望使white-space: pre在display: flex容器内工作，但好像flexbox完全阻止white-space: pre工作。

小提琴 https://jsfiddle.net/silverwind/dhfkap6e应该在保留用于垂直居中的flexbox的同时呈现文本Lost Whitespace。有没有在不引入包装的情况下将两者结合的方法？

Answer 1

  

空白CSS属性设置元素内部空白的方式   处理。

这里有2个元素，您必须在弹性项目上指定边距或填充，也可以在span标签内添加空格

<span>Lost_</span>

Answer 2

尝试一下。

div {
  white-space: pre;
  height:100px;
  display: flex;
  justify-content: center;
  flex-direction: column;
}

<div>
  <span>Lost</span> <span>Whitespace</span> 
</div>