Flat HTML table CSS styling

08.08.2013 by Ilia Raiskin

In this tutorial we show you how to create a flat table with HTML and CSS. In addition we make the table vertically scrollable so that it can be used in responsive design for smaller viewports.


Head 1 Head 2 Head 3
Example 1 Example 2 Example 3
Example 4 Example 5 Example 6



When the viewport is smaller than the table the table will adjust its width and the content of the table will become vertically scrollable. This works because of the following properties: width: auto; overflow: auto; display: block;

About the author

Ilia Raiskin

Ilia Raiskin is a web designer, web developer, blogger and founder of Toolinfy.com.