Overflow-x:auto (table-responsive) doesn't work as expected with flex-nowrap class (bootstrap 4): horizontal scroll bar of the table doesn't want to appear after reducing width of the window to minimal possible width of the table (scroll bar of the table appears much later, i think it depends of the left flex container width). Instead of expected behavior, the right flex container stops shrinking and its content overflows a window/area (window scroll bar appears). I didn't expect this and don't know how to fix it. What I need to do to fix such behavior?
Image top section: right container content doesn't overflow window/area (window width 1250px).
Image central section: right container content overflow window/area (why? and how to fix this?) and window scroll bar appears (window width 998px).
Image bottom section: scroll bar of the table is appears only now (window width 928px).
Here is an example: https://www.codeply.com/go/hKOnFf6iJu (reduce width of the window/area to see this strange behavior).
Without flex-nowrap class scroll bar of the table appears as expected (but, of course, right flex container jump left down after left flex container, if reduce window width to 1250px and lower) and page content doesn't overflow window/area.
Remove "flex-nowrap" here and watch normal overflow behavior:
<div class="container mr-auto ml-3">
<div class="row flex-nowrap">
<div class="col maincont-sb-empty-area d-none d-md-block">
Also, i found same problem in other answer in another topic (but I unable to comment): Fixed width column with a container-fluid in bootstrap
And example from this topic: https://www.codeply.com/go/eMXpgvmHAc (reduce width of the window/area to see how content overflow a window/area and window scroll bar appears).
The idea is to have side menu of the fixed width (left container, side menu will be with fixed position) and content area with fluid width (right container). If window width will be less than 768px then side menu will be hidden and "show menu button" will appear. I'm already have implementation with such side menu, but the bug with window overflow noticed only now, when inserting a wide table in content area.
I don't need sidebars like this one: https://blackrockdigital.github.io/startbootstrap-simple-sidebar/# because i need to show top menu (top navbar) and footer.
