scrimba
Responsive Design
Taking flexbox to the next level
flex-direction, flex-wrap, and flex-flow
Go Pro!Bootcamp

Bootcamp

Study group

Collaborate with peers in your dedicated #study-group channel.

Code reviews

Submit projects for review using the /review command in your #code-reviews channel

flex-direction, flex-wrap, and flex-flow
AboutCommentsNotes
flex-direction, flex-wrap, and flex-flow
Expand for more info
styles.css
run
preview
console
* { box-sizing: border-box; }

body {
margin: 0;
background: #2C73D2;
color: #fff;
text-align: center;
}

.flex-container {
border: 10px solid #F9F871;
max-width: 600px;
margin: 0 auto;
padding: .25em;
}

.flex-item {
background: #8BEE86;
margin: .5em;
padding: .5em;
color: #424656;
}
Console
index.html
-5:15