Large items go out of Flex container.
How to make them not go out of flex container?
I do not want them to wrap.
I expect element sizes will decrease proportionally to their original sizes to fit the container size
And the second option - decrease the certain elements size (third one)
.container{ display: flex; gap: 10px; width: 400px; border: 1px gray solid; padding: 10px;}.element{ padding: 10px; outline: 1px lightgray solid;}<div class="container"><div class="element">11111111</div><div class="element">22222222222222</div><div class="element">3333333333333333333333333333333333333333</div></div>