如何将文本包装在绝对 div 中答案

【问题标题】：How wrap the text inside the absolute div如何将文本包装在绝对 div 中
【发布时间】：2018-06-11 03:38:13
【问题描述】：

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

这是网站上的working example。

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

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

【问题讨论】：

标签： html css onsen-ui onsen-ui2

【解决方案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>

【讨论】：