DataTables Responsive Not Resizing at Bootstrap Breakpoint

madvora

I'm having an issue and I believe I've narrowed it down to the DataTables Responsive plugin. https://datatables.net/extensions/responsive/

So in Bootstrap, I have two columns of six. A DataTable on the left and a div box on the right. When the browser narrows down, these two items should split into their own rows stacked on top of each other with the items centered. However, at that breakpoint, the DataTable doesn't resize to center on the screen. It stays over to the left. If you refresh the page at that width, it will center itself fine, it just doesn't respond to the breakpoint.
If you do the opposite and start the page at the size of a phone and expand the window out, the DataTable will stay scrunched up in a thin column on the left.

If I take out the responsive plugin, it will center itself fine at the breakpoint. However, I want to use this plugin to help with the table at phone size.

I have a fuller example here showing my layout.
https://stackoverflow.com/questions/32148582/datatables-responsive-not-resizing-at-bootstrap-breakpoint