bootstrap table out of screen when body has padding

I have a boostrap table. I want to have a padding on the entire page so I put:

body {
  padding: 70px 20px;
}

But after I do it, the table "ignores" the padding - and makes it 20px wider than the screen (and adds a horizontal scroll)

How can I tell bootstrap table "You have 20px less on each side" - calculate accordingly

Edit:

I made a JSBin for you guys to help me more easily - and on it everything works.... grrrr.... http://ift.tt/1AJibe3

I'm using Ember.js, bootstrap-sass latest (3.3.1) I compared the styles of the resulting tables, and besides width related stuff (duh) everything is exactly the same

I don't see anything out of the ordinary - anyone has a hunch on where to look?