Ответственный размер внутреннего контейнера в пределах ⇐ CSS

[Anonymous]

Может быть, уже слишком поздно в пятницу, но я не могу починить это и не могу найти пример, и я чувствую, что я иду по кругам. b2 . Визуально, b ничего не добавляет, поэтому он выглядит как ряд из четырех контейнеров: , b1 , b2 и c . Эта настройка не может быть изменена, потому что b - угловой компонент, который я не собираюсь разорвать, но я могу добавлять в него все виды. Контейнер b2 должен масштабироваться в зависимости от доступного пространства до минимум размера содержания и максимума данной ширины. Контейнер b2 может быть скрыт, и тогда представление должно стать a , b1 , c , уютно влево выровнен без разрыва.
Вот заполненный пример, где b2 , к сожалению, не меняется в размере. Как мне сделать b2 динамически изменять размер от b2-content , до максимума 200px ? PrettyPrint-Override ">

Код: Выделить всё

div {
box-sizing: border-box;
height: 100%;
background-color: aqua;
border: solid 5px;
}

.container {
display: flex;
border: none;
height: 100px;
background-color: aquamarine;
}

.A {
min-width: 100px;
}

.B {
border: none;
display: flex;
width: fit-content;
}

.B1 {
min-width: 50px;
}

.B2 {
width: 200px;
max-width: 200px;
background-color: burlywood;
}

.B2-content {
height: 50px;
min-width: 100px;
width: 100px;
background-color: red;
}

.C {
min-width: 100px;
}< /code>

A

B1

B2
B2 content


C

Подробнее здесь: https://stackoverflow.com/questions/797 ... hin-limits