console
<div class="g-container">
<div class="g-middle">middle</div>
<div class="g-left">left</div>
<div class="g-right">right</div>
</div>
.g-container {
position: relative;
height: 100vh;
min-width: 400px;
display: flex;
& > div {
height: 100vh;
text-align: center;
color: #fff;
line-height: 100vh;
}
}
.g-middle {
order: 2;
flex-grow: 1;
flex-shrink: 0;
flex-basis: auto;
background: tomato;
}
.g-left {
order: 1;
flex-basis: 200px;
flex-grow: 0;
flex-shrink: 0;
background: orange;
}
.g-right {
order: 3;
flex-basis: 200px;
flex-grow: 0;
flex-shrink: 0;
background: blueviolet;
}