我这里有一个codepen - https://codepen.io/anon/pen/KxLzMV
它是一个简单的网格使用丢失。
最后一列有一个嵌套网格。
此嵌套网格在第一列后面有一个右边距。
我尝试使用循环选项删除它但它不起作用。
如何在嵌套网格上删除此边距。
@use lost;
*{
margin: 0;
padding: 0;
}
body{
background: lightgrey;
}
.block{
background: white;
max-width: 1000px;
}
ul{
list-style: none;
lost-utility: clearfix;
overflow: auto;
}
.mobile-arrow{
display: none;
float: right;
}
.info{
padding: 10px;
}
.one{
background: pink;
lost-column: 2/5;
}
.two{
background: pink;
lost-column: 1/5;
}
.three{
background: pink;
lost-column: 2/5;
}
.three-inner__1{
background: red;
lost-column: 4/5 ;
}
.three-inner__2{
background: green;
lost-column: 1/5;
}
@media(max-width: 650px){
.mobile-arrow{
display: block;
}
.one{
lost-column: 3/5;
}
.two{
lost-column: 2/5 2;
}
.three{
margin-top: 10px;
lost-column: 1/1;
lost-move: 0;
}
}
您可以使用第三个参数覆盖边距:
.three-inner__1{
background: red;
lost-column: 4/5 0 0px;
}