layui使用layui-col-space*栅格系统发现padding加在里面了并不是仅仅只有两个模块之间的间距

bug是这样的

从上面的图片来看问题出现的原因主要是覆盖了官方原有的样式。

解决方案 如下： 

 

 

layui-col-space* 使用之后发现 左边多了padding 而官网是这样描述的  

通过“列间距”的预设类，来设定列之间的间距。且一行中最左的列不会出现左边距，最右的列不会出现右边距。列间距在保证排版美观的同时，还可以进一步保证分列的宽度精细程度。 

 我的代码是这样写的

 

//外层容器 类名 layui-row
.items_con{
      overflow: hidden;
      margin: 0 20px;

}

 

类名items_con覆盖了layui-col-space30的样式 所以在laui-col-space30的基础上是不能加margin的 因为layui-col-space30的源码是这样的：

.layui-col-space30{margin:-15px}.layui-col-space30>*{padding:15px}

 

设置margin 造成了样式覆盖，造成了多了padding

解决方案再去嵌套一级   layui-row    当然也可以不加layui-row这个类名

加完之后的效果如下：

问题解决   ok！ 谢谢关注