Una tabella responsive? #Pillole

Quante volte siamo impazziti per gestire una tabella html responsive? Una soluzione veloce è pratica ce la offrono i css. Vi riporto un semplice esempio:

	table {
	width: 100%;
	border-collapse: collapse;
	}
	table, th, td {
	border: 0px solid black;
	}
	@media (max-width: 600px) {
		table, thead, tbody, th, td, tr {
			display: block;
		} 
		thead {
			display: none;
		}
		tr {
			margin-bottom: 10px;
			border: 0px solid #ccc;
		}
		td {    
			padding: 5px;    
			font-weight: bold;
		}
	}

A piacimento potete andare a personalizzare la tabella partendo da questa struttura che ci permette di incolonnare una sopra all’altra le celle della colonna quando siamo in modalità mobile.