Sorry for the cryptic question, it's a bit hard to explain, but opening the JSfiddle in FF and in chrome should make the problem obvious.
The %width columns are behaving in a way which I don't follow at all. Chrome does a predictable job at large screen modes, but messes up at smaller screens. Firefox seems to add the padding AFTER setting the unpadded column as the width percentage, resulting in wider than expected columns.
Column percentages:
0 - NOT SET
1 - 10
2 - 10
3 - 10
4 - NOT SET
5 - 5
6 - 5
7 - 5
8 - 5
9 - 5
10 - 5
11 - 5
You'd expect the NOT SET columns sum to 35%, but in FF they're completely reduced.
You'd expect the second (1) column to be 111px wide (total is 1115px), which is the case in chrome (111px) but not in FF (111 + (2x18) = 147 px). However, at the small screens, chrome just drops some columns 
. Does anybody know how to solve these problems?
All I want is my columns to be a standard percentage of the page width, with similair behaviour in all browsers.
Picture of chrome/FF large and small screens: https://imgur.com/a/1UylQ
JSfiddle: https://jsfiddle.net/4mtz00s4/6/