Table design

by agib

HTML

<h4>Table data</h4>
<table>
	<tr>
		<th>Table Header</th>
        <th>Tabe Header</th>
        <th>Table Header</th>
        <th>Tbl Header</th>
	</tr>
	<tr>
		<td>Table Cell</td>
		<td>Table Cell</td>
		<td>Table Cell</td>
		<td>Table Cell</td>
	</tr>
	<tr>
		<td>Table Cell</td>
		<td>Table Cell</td>
		<td>Table Cell</td>
		<td>Table Cell</td>
	</tr>
	<tr>
		<td>Table Cell</td>
		<td>Table Cell</td>
		<td>Table Cell</td>
		<td>Table Cell</td>
	</tr>
	<tr>
		<td>Table Cell</td>
		<td>Table Cell</td>
		<td>Table Cell</td>
		<td>Table Cell</td>
	</tr>
	<tr>
		<td>Table Cell</td>
		<td>Table Cell</td>
		<td>Table Cell</td>
		<td>Table Cell</td>
	</tr>
	<tr>
		<td>Table Cell</td>
		<td>Table Cell</td>
		<td>Table Cell</td>
		<td>Table Cell</td>
	</tr>
	<tr>
		<td>Table Cell</td>
		<td>Table Cell</td>
		<td>Table Cell</td>
		<td>Table Cell</td>
	</tr>
</table>

CSS

body { 
    background-color: #F4F4F6;
    color: #262626;
}
table {
    margin: 40px;
    width: 80%;
    font-family: Verdana;
    font-size: 14px;
    border-collapse: collapse;
}
table tr th,
table tr td {
    padding: 8px 12px;
}
table tr th { 
    background-color: #DDD;
    border-left: 1px solid #EEE;
    font-size: 12px;
}
table tr td {
    border-top: 1px solid #EEE;
    border-bottom: 1px solid #EEE;
}