Сообщение от Shitbox2
|
Без `display: contents` реально?
|
Если только поменять немного HTML...
<input type="range" min="0" max="1600" value="400" oninput="document.querySelector('.container').style.width = this.value + 'px';">
<div class="container">
<div class="item">item-1</div>
<div class="elem">elem-1</div>
<div class="elem">elem-2</div>
<div class="elem">elem-3elem-3-elem-1ele</div>
<div class="elem">elem-3-elem-1</div>
<div class="elem">elem-3-elem-2</div>
<div class="elem">elem-3-elem-3-elem-3-elem-1</div>
<div class="elem">elem-4-elem-1</div>
<div class="elem">elem-5</div>
<div class="last-group">
<div class="item item-filler">item-2</div>
<div class="item">item-3</div>
</div>
</div>
<style>
.container {
min-width: 250px;
width: 400px;
box-shadow: 0 0 0 2px, inset 0 0 0 1em white;
background: gray;
display: flex;
align-items: flex-start;
align-content: flex-start;
flex-wrap: wrap;
}
.container > .elem {
background: red;
padding: .8em;
margin: 1.2em;
}
.container > .item, .container > .last-group > .item {
background: gray;
padding: 2em;
box-shadow: inset 0 0 0 1em white;
}
.container > .last-group {
display: flex;
flex: 1;
}
.container > .last-group > .item-filler {
flex: 1;
}
</style>