[RESOLVED] Image next to a Division

[Rain Lover]

Hi,

How can I put an <img> next to a <div> so the image vertically aligns in the middle?

<img src="http://devcentral.f5.com/weblogs/images/comment-icon.gif"><div style="font:10pt Arial;padding:5px;background-color:#ccc;"><span style="float:right">No. 1</span><span style="font-weight:bold;padding-right:10px">John Doe</span><span style="color:#808080">11/14/2010 3:23:44</span></div>

I know how to do it using a table:

<table style="font:10pt Arial">
<tr>    
<td style="vertical-align:middle"><img src="http://devcentral.f5.com/weblogs/images/comment-icon.gif"></td>    
<td style="width:100%">
<div style="padding:5px;background-color:#ccc;border-top:1px solid #DEDEDE"><span style="float:right">No. 1</span><span style="font-weight:bold;padding-right:10px">John Doe</span><span style="color:#808080">11/14/2010 3:23:44</span></div>
</td>
  </tr>
</table>

But I wonder if I could do it without a table.


Thanks in advance!
Rain Lover

[EMaks]

I've done it like this

<img src="http://devcentral.f5.com/weblogs/images/comment-icon.gif" style="float:left; padding-top: 5px;">
<div style="font:10pt Arial;padding:5px;background-color:#ccc; margin-left:20px;">
<span style="float:right">No. 1</span><span style="font-weight:bold;padding-right:10px">John Doe</span><span style="color:#808080">11/14/2010 3:23:44</span></div>

[Major Payne]

Your question has already been answered here.. Might be nice to respond to answer posted.