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

Question

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

这是网站上的一个工作示例。

为了测试它，我们需要增加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>