CSS - vertical-align: bottom; is not working - please help

I am unable to vertically align text in my DIVs. Please go to http://www.uzairusman.com/cssproblem/ & see it live. I used below code but no use :(

vertical-align:bottom;
vertical-align:middle;

Please guide me how can I fix this problem.

Regards

Edit : Setting a margin-top may suit. #topnavsub img {margin-top:15px;}

You could use this for #topnavsub:

#topnavsub{width:1002px;height:17px;background:#f67309 url(images/hr_orng_bgx.gif) repeat-x;padding-top: 15px;}

I am not sure what you mean.
Is this relevant?

Also putting a linefeed after each line makes the text vertical.

If I have misunderstood, please ignore.

Frank

<div id="topnavsub">
<ul>
<li><img src="images/ico_arrow.gif" width="4" height="6" border="0" alt="" /> About Us &nbsp;&nbsp;</a>
<li><img src="images/ico_arrow.gif" width="4" height="6" border="0" alt="" /> Our Services &nbsp;&nbsp;</a>
<li><img src="images/ico_arrow.gif" width="4" height="6" border="0" alt="" /> Mission Statement &nbsp;&nbsp;</li>
<li><img src="images/ico_arrow.gif" width="4" height="6" border="0" alt="" /> Contact Us &nbsp;&nbsp;</li></ul>
</div>

That's a good point you've made there Frank. Semantically speaking that menu system should be created using a list, as it is a list of navigational links. I'd suggest what Frank has there and then give your <ul> an id and position it within that top div using padding and margins.