Question

I have an image with a div as a neighbor, and I cannot seem to get the top of the elements to line up with each other. The text in the div ends up lining up with the bottom of the image.

So I basically have the following the HTML:

<img src="" /><div class="block">This lines up with the bottom of the image.</div>

What kind of CSS would I have to apply to get the tops of the elements lined up with each other?

I have googled “align image div”, but I cannot find the solution to my problem.

Thanks in advance.

Answer 1

Does floating do what you want?
http://jsfiddle.net/Ma2c5/

img { float: left }
div.block { float: left }

You might want to clear your floats after these elements, read up on the subject on http://www.quirksmode.org/css/clearing.html