<div>溢出“float：right”

Question

我使用以下行从javascript生成聊天消息：

var d = '<div class="triangle-border2 left">' + message + 
        '<span style="flex: 1 1 30px"></span><span style="float:right; font-size:80%; color:#5a8f00;margin-top:2px">' + 
         h + ':' + m + '</span></div>';

message是邮件正文，h是小时，m是分钟。 div的样式最大宽度。以下是一些消息的输出：

'kkkk'和'nnnnn'行的问题是什么使时间溢出div？为什么它不像'mmmmmm'线？我该如何解决？

注意：浏览器是Chromium，这是固定的。

Answer 1

你没有清理你的浮动：

.triangle-border2:after {
    content:'';
    display:block;
    height:0;
    overflow:hidden;
    clear:right;
}

Answer 2

尝试给他们overflow-y: hidden;

我不知道为什么，但有时通过强制div扩展而不是允许内容溢出来解决我的类似问题