14
Well this is easy — tables and all the text within them is already responsive by virtue of all the things we’ve discussed previously.
The only thing left to do is make the standard and dense tables wider when the screen reaches a certain width (incidental tables and footnote tables do not do this, they remain narrower than the body text at all screen widths).
@media all and (max-width:760px){ .table-clean { width: 100%; margin: 0; } }
@media all and (max-width:760px){ .table-dense { width: 100%; margin: 0; } }
When the screen is 760 pixels wide or less, the table width is set to 100% and the margins to zero.
And that’s it.