Border around definitions

Green and Golden Bell Frog: Nisl ut aliquip ex ea commodo consequat
Bull Frog: Lorem ipsum dolor sit amet elit, sed diam nonummy nibh euismod tincidunt
Spotted frog: Facilisis at vero eros et accumsan


	HTML

	

	<dl class="border-around">

	<dt>Green and Golden Bell Frog</dt>

	<dd>Nisl ut aliquip ex ea commodo consequat</dd>

	<dt>Bull Frog</dt>

	<dd>Lorem ipsum dolor sit amet elit...</dd>

	<dt>Spotted frog</dt>

	<dd>Facilisis at vero eros et accumsan</dd>

	</dl>

	

	

	CSS

	

	dl.border-around

	{

	margin: 2em 0;

	padding: 0;

	width: 20em;

	}

	

	.border-around dt

	{

	background-color: #131210;

	color: #959289;

	padding: .5em .5em;

	font-weight: bold;

	text-align: center;

	text-transform: uppercase;

	border-left: 1px solid #131210;

	border-right: 1px solid #131210;

	border-top: 1px solid #131210;

	}

	

	.border-around dd

	{

	margin: 0 0 1em 0;

	background: #DBD8D8;

	text-align: center;

	padding: 1em .5em;

	font-style: italic;

	border-left: 1px solid #131210;

	border-right: 1px solid #131210;

	border-bottom: 1px solid #131210;

	}