Core Code
Core Code Modern Dev Handbook

Basic Flex Container

Create a flex container using display:flex.

Preview

Code

<style>
.container{
display:flex;
gap:10px;
}

.item{
background:#2563eb;
color:white;
padding:20px;
}
</style>

<div class="container">
<div class="item">Item</div>
<div class="item">Item</div>
<div class="item">Item</div>
</div>

More Flexbox Intro Examples (8)

example Flex Row Direction open example example Flex Column Direction open example example Center Items with Flexbox open example example Space Between Items open example example Equal Flex Columns open example example Flexbox Navbar open example example Flexbox Card Layout open example example Flexbox Axis Demo open example