CSS去除li左边的缩进,li左边一截空白区域


今天在修改自己网站首页模板的时候发现一段LI前面老是出现一定距离的缩进(如下图),老朋友碰到了新问题,通过设置 li的list-style,margin,padding等属性仍旧如故,真是搞得头都大一圈。

CSS去除li左边的缩进,li左边一截空白区域

试了很多办法不管怎么设置都无法去除,因为导入了Bootstrap等前端框架,一度以为是冲突引起的问题,花了大半天时间都未能解决问题,即查看浏览器调试,但没有发现影响布局的其它CSS代码,没办法了,只好问度娘,突然发现一个大家可能都会忽略的问题:那就是前面我们设置的LI的属性需针对UL设置才能起效果

代码:

.box-body ul{
    list-style-type:none;
    padding:0;
    margin:0;
}
.box-body ul li{
    float: left;
    width: 50%;
    height: 176px;
    text-align: center;
    border:1px solid #eee;
    background:#fff;
}

注:本文转载自唯马网络,转载目的在于传递更多信息,并不代表本网赞同其观点和对其真实性负责。如有侵权行为,请联系我们,我们会及时删除。

评论


匿名用户:
2020-02-12 01:02:50
.bxyliu3 ul{list-style:none;margin:0;padding:0;}


匿名用户:
2020-02-12 00:23:14

我也遇到这个问题了,解决