Aligning Bottom of Three Columns

[pamr]

Right now, I'm working on the most basic of basic website using Dreamweaver CS5 and CSS. I attached what the layout should look like. I'm having major issues with those three boxes underneath the featured image. No matter what I do (add padding to the image numbers, make the image number larger in Photoshop with a bunch of white space at the bottom, etc.), I can't get them to line up equally. Here is the relevant code from the HTML page:

<div id="left_column">
<h2><img src="images/1.png" height="220" align="left"/>You've had an accident and it wasn't your fault</h2>
<p>Chances are a worryfreeclaims representative has already been in contact and qualified you for the program. You're ready to get started.</p>
</div>
<div id="center_column">
<h2><img src="images/2.png" height="220" align="left"/>Your car goes to one of our qualified shops</h2>
<p>Our nationwide network of qualified shops means you are being serviced by one of the best body shops in your area. And work is guaranteed.</p>
</div>
<div id="right_column">
<h2><img src="images/3.png" width="95" height="238" align="left" />Your car is fixed, no fuss, no hassle</h2>
<p>Your repairs will be completed and your car will be back to it's pre-accident condition. It's worry free!</p>
</div>



Here is the CSS code:

#left_column, #center_column, #right_column {
width: 290px;
float:left;
padding: 10px 10px 10px 10px;
border:2px solid #85c441;
-moz-border-radius:6px; -ms-border-radius:6px; -o-border-radius:6px; -webkit-border-radius:6px; border-radius:6px;
}
#center_column, #right_column {
margin-left: 10px;
}


Any ideas? This is making me crazy! Thank you so much in advance

[gentleone]

I took the image out of the h2 tag and deleted the 'align: left' (is deprecated). I gave the img a float: left in the CSS and I guess you will need to adjust some more things to meet the design, but you have a beginning now.

http://dabblet.com/gist/2765452

[pamr]

Thank you so much!!