Flexbox Code Challenge

Now that you have an available flex class, apply it to the correct element to make sure that all of our blocks are placed next to each other horizontally rather than stacked on top of each other like they are right now.

index.html
<style>
.box {
width: 100%;
height: 100px;
}

.flex {
display: flex;
}
</style>
<section>
<div class="box" style="background:red">1</div>
<div class="box" style="background:green">2</div>
<div class="box" style="background:blue">3</div>
<div class="box" style="background:yellow">4</div>
</section>

Providing the lift to launch your development career

© 2025 Chris Courses. All rights reserved.