Stop text from a wrapper around an image

I ruin my mind trying to get this style right. I have a fixed size image with an unpredictable height div text to the right of it. I want the top of the text to match the top of the image, but DO NOT wrap it around. My markup:

<img height='231px' width='132px' style='float:left' /> <div>Text</div> 

I would like to find a solution that is not related to using a table, but at the moment I am exhausted and cannot think about how to do this using css / divs

+4
source share
2 answers

That should do the trick.

 <div style="margin-left: 132px">Text</div> 

To have a space between the text and the image, increase the size of the field or add padding-left .

+7
source

DanielB answers this, but I just propose alternative solutions; you never know if this can come in handy. You can put the image and div in a container with a fixed width, set a fixed width on the image and div, which will add up to the width of the container, and also melt the div.

 <div id="container"> <img height='231px' width='123px' style='float:left' /> <div>Text</div> </div> #container div { float:left; width: 123px; } #container { width:246px; } 

http://jsfiddle.net/thomas4g/A7ZHg/3/

+2
source

All Articles