table experiment

dabblet.css

/**
 * table experiment
 */

body {
	background: #ECECEC;
	min-height:100%;
	color: black;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

h1 {
	color: #b04;
}

table {
	width: 95%;
	margin: 0 auto;
	border-collapse: collapse;
}

table thead th:first-child {
	border-left: 0px;
}
table thead th {
	text-align: left;
	border-left: 1px solid #ECEAEA;
	color: #b04;
	background: white;
	margin: 0;
	padding: 10px 0 10px 15px;
}

table thead th:last-child {
	text-align: right; 
	padding: 10px 15px 10px 0;
}

table tbody td {
	border-left: 1px solid #ECEAEA;
	padding: 10px 0 10px 15px;
	background: #b04;
	color: white;
}

dabblet.html

<h1>it's all tabled up now. lame joke, i know!</h1>
<table>
	<thead>
		<tr>
			<th>column 1</th>
			<th>column 2</th>
			<th>column 3</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td>lorem</td>
			<td>ipsum</td>
			<td>dolar sit table</td>
		</tr>
		<tr>
			<td>lorem</td>
			<td>ipsum</td>
			<td>dolar sit table</td>
		</tr>
		<tr>
			<td>lorem</td>
			<td>ipsum</td>
			<td>dolar sit table</td>
		</tr>
	</tbody>
</table>

settings.json

{"view":"split-vertical","prefixfree":"1","page":"css"}