bootstrap styling breaks on explicit 'dom' options

xa3a.mc

i am using DataTables-1.10.8, Bootstrap-3.3.5, jQuery-1.11.3, and dataTables.bootstrap.css from github.
i fiddled with the example bootstrap styling from https://datatables.net/examples/styling/bootstrap.html and added the options dom with value 'lfrtip', and the styling breaks (e.g. the length changer and filtering are no longer on the same line, table info and pagination are neither, i.e. some spaces are added).
please help on how to fix the css (to draw the table the same as if not using dom options), so i can use the dom options