UL列表-最后一个LI之后的干扰行



我不一定知道如何描述我的问题。创建列表后,最后一个<li>标记后面会出现一个短划线(请参阅附件中的照片(。我怎样才能去掉那条线?你能帮我吗?

描述我的问题的照片

以下代码:

CSS:

#app_ulist ul {
padding-left: 30px;
columns: 2;
-webkit-columns: 2;
-moz-columns: 2; 
list-style-type: none; 
position: relative;
}
#app_ulist>ul>li:before {
content: "2713";
}
#app_ulist>ul:after, #app_ulist>ul:before {
content: " ";
display: table;
}
#app_ulist>ul>li:before {
color: #fff;
display: block;
font-family: fontello;
font-size: 12px;
font-weight: 400;
left: -29px;
line-height: 20px;
margin-top: -1px;
position: absolute;
text-align: center;
width: 20px;
text-indent: 1px;
}
#app_ulist>ul>li {
margin-bottom: 10px;
padding-top: 0;
position: relative;
}
#app_ulist> ul > li::before {
background-color: #698e9e;
}

HTML:

<div id="app_ulist" class="mt-5">
<ul>
<li>Test</li>
<li>Test</li>
<li>Test</li>
<li>Test</li>
<li>Test</li>
<li>Test</li>
</ul>
</div>

您需要从#app_ulist>中删除页边空白顶部:-1px;ul>李:以前。

#app_ulist>ul>li:before {
color: #fff;
display: block;
font-family: fontello;
font-size: 12px;
font-weight: 400;
left: -29px;
line-height: 20px;
position: absolute;
text-align: center;
width: 20px;
text-indent: 1px;

}

相关内容

最新更新