We have this problem with display: table; in our flexible project (s). Our table is wrapped and displays 100% width. One of the cells is a fixed width px.
When you change the browser size, the cells leave a space of 1 pixel on the right, each 3px te window size changes. Is there a solution or a workaround for this, we cannot find it ...
Here is an example made in Codepen, check it in Chrome or Safari and resize the browser window horizontally:
http://codepen.io/jstnrs/pen/RNqOWP
.table {
display: table;
table-layout: fixed;
width: 100%;
}
.table-cell {
display: table-cell;
}
.table-cell-01 {width: 25%;}
.table-cell-02 {width: 25%;}
.table-cell-03 {width: 100px;}
source
share