DEEP INTO FLEXBOX example-9
JADE
.container
.flex-box
.flex-item.two
| a
.flex-item.four
| b
.flex-item.one
| c
.flex-item.three
| d
SCSS
.container {
background: red;
padding: 10px;
margin: 10px;
}
.flex-box {
background: blue;
padding: 10px;
margin: 10px;
display: flex;
}
.flex-item {
background: pink;
margin: 10px;
padding: 10px;
width: 200px;
&.one {
flex-shrink: 1;
}
&.two {
flex-shrink: 2;
}
&.three {
flex-shrink: 3;
}
&.four {
flex-shrink: 4;
}
}
