[css] Table set fixed column width

Background : Using JQuery Datatable generated dynamically table but push columns off the layout.

Example :
Image 1

Solution :
Add table-layout to the css, and of course give width to each column :

table-layout: fixed;

The reason why :
Fixed table layout algorithm:
The horizontal layout only depends on the table’s width and the width of the columns, not the contents of the cells
Allows a browser to lay out the table faster than the automatic table layout
The browser can begin to display the table once the first row has been received

Ref from : w3schools


[CSS] re-styles

If you are willing to get a change the style of your site.

Here is a very good article who talks about re-styles a site in css/less/sass etc. Worth reading.

Link : Mediums CSS