У меня есть гибкий элемент, настроенный для переноса, и я хочу установить ширину его родительского элемента, чтобы адапт ⇐ CSS

[Anonymous]

Поведение, которое я пытаюсь получить, заключается в том, что когда размер экрана меняется и гибкие элементы завертываются внутри родительского элемента, то родительский элемент адаптирует ширину, чтобы соответствовать содержимому. Я не совсем уверен, есть ли какая -либо настройка, где это возможно вообще в CSS, но если есть, может ли кто -нибудь указать это? Родитель, которого я хочу адаптироваться к контенту, но когда я устанавливаю его ширину на подходящую content , он все еще заполняет ширину контейнера. Я уже пробовал много комбинаций, таких как ширина: max-content с максимальной шириной: 100%, но они тоже не работают.

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

*{
margin: 0;
padding: 0;
box-sizing: border-box;
}
body{
background: #222;
display: flex;
align-items: center;
justify-content: center;
height: 100vh;
}
.full{
width: 100%;
height: 90vh;
background: #eee;
}
.limited{
max-width: 90vw;
background: #f4f4f5;
display: flex;
flex-direction: row;
gap: 30px;
height: 100%;
align-items: center;
margin: auto;
}
.column1{
background: teal;
width: 200px;
height: 100%;
flex-shrink: 0;
}
.column2{
background: turquoise;
height: 100%;
width: 100%;
}

.wrapper{
display: flex;
flex-wrap: wrap;
gap: 5px;
background: forestgreen;
width: fit-content;
}

.el{
width: 200px;
height: 100px;
background: crimson;
flex-shrink: 0;
}< /code>

Здесь есть код.

Подробнее здесь: https://stackoverflow.com/questions/793 ... h-to-adapt