DEEP INTO FLEXBOX example-8

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; &.one { flex-grow: 1; } &.two { flex-grow: 2; } &.three { flex-grow: 3; } &.four { flex-grow: 4; } }
JAVASCRIPT
Expand for more options Login