JSFiddle - React, Tailwind, and code Playground

by nerdess

HTML

<table>
		<thead>
			<tr>
				<th>header 1</th>
				<th>header 2</th>				
			</tr>
		</thead>
		<tbody>
			<tr>
				<td>lisa</td>
				<td>bart</td>			
			</tr>
			<tr>
				<td>homer</td>
				<td>marge</td>			
			</tr>
		</tbody>
	</table>

CSS

body {
		background: yellow;
	}

	table {
		position: relative;
		width: 100%;
	}

	table:before {
		content: " ";
		position: absolute;
		background-image: url(http://placekitten.com/10/50);
		background-repeat: no-repeat;	
		display: block;
		z-index: 1;
		position: absolute;
		top: 10px;
		left: -10px;
		width: 10px;
		height: 50px;
	}

	table:after {
		content: " ";
		position: absolute;
		background-image: url(http://placekitten.com/10/50);
		background-repeat: no-repeat;	
		display: block;
		z-index: 1;
		position: absolute;
		top: 10px;
		right: -10px;
		width: 10px;
		height: 50px;
	}

	th {
		background: #ccc;
	}