<div class="container">
<div class="div1">Box 1</div>
<div class="div2">Box 2</div>
<div class="div3">Box 3</div>
<div class="div4">Box 4</div>
<div class="div5">Box 5</div> </div>
xxxxxxxxxx
.container
{
display:flex;
height: 100px;
width: 300px;
border:1px solid black;
margin: 10px;
}
div > div
{
flex-basis:100px;
margin:10px;
}
.div1
{
background-color: #97ffff;
/* flex-shrink:4; */
}
.div2
{
background-color: #8f5890;
flex-shrink: 5;
}
.div3
{
background-color: #e4bb69;
}
.div4
{
background-color: #78add5;
}
.div5
{
background-color: #db8980;
flex-shrink: 6;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.