Content should handle margins in regards to sidenav state OOTB

Continuing #5589 since I never got a response:

https://codesandbox.io/s/long-flower-p3jgd

Here is a CodeSandbox which demonstrates the following:

1. If the sidenav is expanded on smaller screens, you can NOT click outside the sidenav to close it.
2. On larger screens, the sidenav covers the Content instead of it accomodating the fixed sidenav.
3. Styling on new versions is completely inconsistent with the outdated docs, as seen in the sidenav.

For the 10th time, bx–offset-lg-3 bx–col-lg-13 is a hack job, and changes from screen to screen. Content should actually serve a purpose instead of being a useless div, it should accomodate the EXACT width of the SideNav. Furthermore, the docs should be updated such that we don’t have to post 10 issues to address the same problem only to be pointed to outdated information.

[ghost]

Ah ok awesome, I’ll give that a try!

[ghost]

Ya that’s probably a better way of putting it. On that same note, SideNav should also close when you click outside of it, on the overlay.