this content was originally posted here.

stack a table using css responsive

this can be useful for fitting tables into smaller screens, usually add this to a media query.

#tableid td {
	display: table-row;
	width:100%;
	display:block;
}

and with a screen size added

@media (max-width: 900px){ 
#tableid td {
	display: table-row;
	width:100%;
	display:block;
	text-align:center;
}
}

this will take all the elements of a table, like td cells and span them to 100% width. You might also want to center the text.

this demo table should stack if the window size is less than 900px wide

some example data
some example data some example data some example data

Demo