Można również użyć po prostu właściwości flex i ustawić stałą szerkość prawego boxa a lewy automatycznie będzie dostosowywał się do swojego "rodzica" konternera. Zmodyfikowany kod VBService:
<div class="container">
<div class="box-1"></div>
<div class="box-2"></div>
<div class="box-3"></div>
</div>
.container {
display: flex;
flex-direction: row;
flex-wrap: wrap;
width: 90vw;
border: 2px solid red;
}
.box-1 {
flex: 1 1 auto;
background-color: orange;
}
.box-2 {
flex: 0 0 100px;
background-color: green;
}
.box-3 {
flex: 1 1 100%;
background-color: yellow;
}
[class^="box"] {
padding: 20px;
}
[class^="box"]::before {
content: attr(class);
}