How to make friends flex-element and owl-carousel2?

Question

css

Hello. The flex container with row nowrap has 2 flex items. One of them is a certain size, but we don't need it. The second one contains the carousel and has flex width: 8 8 800px and max-width: 800px. So tell me how to make the carousel shrink when the screen is reduced? She simply does not recalculate the width of the slides. If you do a row wrap and set the flex to the element with the carousel flex: 1 1 auto, then it starts working normally. But then the blocks are on different lines, and it happens too early. I hope I explained clearly. Who knows what's the problem?

Answer 1

I decided myself. Not for everyone, but at least in some cases it works. Because I know that my first flex element is always 400px wide so I did this:

flex: 8 8 auto
max-width: calc(100% - 400px)