html - 如何将文本包装在绝对 div 中

Question

我正在使用 Vue Onsen UI 创建渐进式网络应用程序。我有一个标题，它可能有点长，我将它放在中心，希望它能正常换行，但事实并非如此。 toolbar 类是绝对定位的。

这是一个working example在网站上。

为了测试它，我们需要增加 div.center 中文本的大小。

有人可以帮助我理解并解决这个问题吗？如果需要更多信息，请告诉我。

Answer 1

似乎 CSS 类“center”覆盖了 white-space 和 line-height 属性。以下将为您工作，

.multiline-center {
   height:100%; 
   display: flex; 
   align-items: center; 
   justify-content: center; 
   white-space:normal; 
   line-height:12pt
}

<div class="center">
    <div class="multiline-center">
        {{ title }}
    </div>
</div>