Hi,

I am working on a simple design but I am not able to get it. Please see my code. How to make the 5th box's top go near the 1st box's bottom ?

HTML Code:
<html>
<head>
	<title>Grid</title>
	<style>
	#content { width:1188px; }
	.box { margin: 5px; padding: 5px; background: #e0dfdd; font-size: 11px; float: left;}
	.col1 { width: 230px; }	
	</style>
</head>

<body>

<div id="content">
	<div class="box col1"><p>1 - Lorem ipsum dolor sit amet</p></div>
	<div class="box col1"><p>2 - Lorem ipsum dolor sit amet</p><p>Lorem ipsum dolor sit amet</p></div>
	<div class="box col1"><p>3 - Lorem ipsum dolor sit amet</p></div>
	<div class="box col1"><p>4 - Lorem ipsum dolor sit amet</p><p>Lorem ipsum dolor sit amet</p></div>
	<div class="box col1"><p>5 - Lorem ipsum dolor sit amet</p></div>
</div>

</body>
</html>
Thanks.