<style>
#main{
border: 5px solid gray;
display: flex;
width: 300px;
height: 300px;
}
/* flex:1 */
/* flex : flex-grow | flex-shrink | flex-basis */
#main .content{
/* flex:1; */
/* flex-grow: 1; */
}
/* flex-shrink ve flex basis */
.content{
/* flex-basis: 200px; */
}
.a{
/* flex-shrink: 0; */
}
</style>
<main id="main">
<div class="content a" style="background: rgb(115, 115, 202);">
<p>Content</p>
</div>
<div class="content b" style="background: rgb(115, 202, 129);">
<p>Content</p>
</div>
<div class="content c" style="background: rgb(202, 115, 115);">
<p>Content</p>
</div>
</main>
