li中包含div内容越界问题

今天搞了一个页面，其中有一个效果大概下面这个样子：

代码如下：

<li><label>操作备注：</label><div  style="word-break:break-all;display: inline-flex;width: 458px;"  id="remarkDetail"></div></li>

如果css中没有display: inline-flex用float:right代替则会变成则会变成：

li的高度会固定不会被div内容高度而改变，会发生变形。