Hi there, I'll jump right to the code then write below what I want to do...

Code:
div#content {
	width: 900px;
	margin: 0 auto;
}
div#content img {
	float: left; 
	margin-right: 10px;
	margin-bottom: 10px;
	background-color: #FFF;
	border: 1px solid #666;
	padding: 10px;
}
div#work { 
	background: url(heading_work.png) no-repeat;
	width: 100px;
 	height: 25px;
 	margin: 20px auto;
}
Code:
<div id="content">
<div id="work"></div>
<a href=""><img src="icon.png" alt="" width="264" height="198" /></a>
<a href=""><img src="icon.png" alt="" width="264" height="198" /></a>
<a href=""><img src="icon.png" alt="" width="264" height="198" /></a>
<div class="clear"></div>
</div>
In the HTML code, I'm gonna have more images.. so 3 in each row, probably 3 more rows, anyways, as it sits I like it but I want to add a shadow to the bottom of each image. What would be the best way to go about adding one to each image. Thanks for any help.