Html 将li布局显示为flex

是否有人可以帮助了解以下代码无法按预期工作的原因：

我希望第二个选项内容（“发生错误时记录并限制…”）包装在黄色背景中

.flex{
显示器：flex；
显示：-webkit flex；
显示：-moz flex；
显示：-ms flexbox；
显示：-ms flex；
位置：相对位置；
最小高度：0；
最小宽度：0；
}
.flex--1{
flex:1自动；
}
.flex--0{
webkit-flex-grow:0；
-webkit flex收缩：0；
-moz-flex:0；
flex:0自动；
}
输入[type=radio]。单选按钮+标签。单选标签{
左侧填充：20px；
高度：16px；
显示：内联块；
线高：16px；
背景重复：无重复；
背景位置：0；
字体大小：14px；
垂直对齐：中间对齐；
光标：指针；
颜色：#666666；
}
李{
列表样式类型：无；
显示：列表项；
}

发送消息

总是


错误发生时记录日志，错误发生时限制日志缓存至日志，错误发生时限制日志缓存至日志，错误发生时限制日志缓存至日志，错误发生时限制日志缓存至日志，错误发生时限制日志缓存至日志
当发生错误时限制日志缓存toLog，当发生错误时限制日志缓存toLog，当发生错误时限制日志缓存toLog，当发生错误时限制日志缓存toLog，当发生错误时限制日志缓存toLog，并限制日志缓存
toLog当错误发生时限制日志缓存toLog当错误发生时限制日志缓存toLog当错误发生时限制日志缓存并将日志缓存限制为
KB

元素上需要一个

最小高度

，以随内容增长，因此您可以更改此值

input[type=radio].radio-button + label.radio-label {
    padding-left: 20px;
    height: 16px;

对此

input[type=radio].radio-button + label.radio-label {
    padding-left: 20px;
    min-height: 16px;

旁注：

尝试使用CSS文件（推荐）或内联样式，因为不建议同时使用这两种样式

所以，举个例子，而不是这个

<li class="flex" style="background-color: yellow;">

---

只需移除单选按钮的高度，高度：16px；通过调整整个

ul

，您可以稍微简化代码。例子——谢谢你的回答！

<li class="flex yellowBg">

.yellowBg {
    background-color: yellow;
}