dio-v
3/12/2014 - 8:01 AM

Vertical Table

Vertical Table

/* Force table to not be like tables anymore */
	table.verticalTable, 
	.verticalTable thead, 
	.verticalTable tbody, 
	.verticalTable th, 
	.verticalTable td, 
	.verticalTable tr { 
		display: block; 
	}
 
	/* Hide table headers (but not display: none;, for accessibility) */
	.verticalTable thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
 
	.verticalTable tr {  }
 
	.verticalTable td, .verticalTable tr th { 
		/* Behave  like a "row" */
		border-bottom: none!important;
		/*border-bottom: 1px solid #eee;*/ 
		position: relative;
		white-space: normal;
		text-align:center!important;
        width:100%!important;
	}

	.verticalTable td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
		text-align:left;
		font-weight: bold;
	}
/* END Force table to not be like tables anymore */