How to apply border radius on table row

<table>
<tr class="head">
	<td>Title 1</td>
	<td>Title 2</td>
</tr>
<tr>
	<td>Col 1</td>
	<td>Col 2</td>
</tr>
<tr>
	<td>Col 1</td>
	<td>Col 2</td>
</tr>
<tr>
	<td>Col 1</td>
	<td>Col 2</td>
</tr>
</table>

<style>
table{
	width:100%;
	border-collapse: collapse;
}
tr td{
	padding:10px;	
}
tr.head td{
	background-color:#D83125;
	color:#fff;
}
tr.head td:first-child{
	 border-top-left-radius: 10px;
	 border-bottom-left-radius: 10px;
}
tr.head td:last-child{
	 border-top-right-radius: 10px;
	 border-bottom-right-radius: 10px;
}
</style>


Share on Google+Share on FacebookTweet about this on TwitterEmail this to someone