Image Left Align Error

[samvb]

Hi,

This thing that might simple is really drivin me crazy. I have a small image that i want to align to the top left and the text would revolve around it. It seems to work in IE but not in others. In opera,mozilla and safari, the image doesn't start at top. Instead, there is a paragraph or so on top of it. The image and the text are located within the same div. Here is my code:

<div>
<img src="d.jpg" id="leftalign"> Content goes here content goes here
 
</div>
 
 

The css code:

#leftalign {float:left;width:150px; height:152px; margin: 0 15px 15px 0;}
 
 

i have tried clear:both and display:block but nothing changed. what am i doin wrong here?

[drhowarddrfine]

The rule is this: if it works in IE but not Firefox/Opera/Safari/Chrome, then your markup is wrong. Never, ever trust IE to do anything right.

The text should continue on to the end of the line and the screen. There's not enough text in your example to make it wrap around but, if you wish, just change the width of the div to make that happen and then it will also wrap around the image.

I don't have IE with me right now but who knows what it will do.

[samvb]

Hey,

The text i included in the e.g. is just an e.g. other wise it is a full page text in my site. Sorry but could you please paste kinda of a complete code?

[drhowarddrfine]

To be sure, I used your markup as is and added 12 paragraphs. The text properly wraps around the image in all the modern browsers: chrome/opera/firefox.

[Ashwani Sharma]

Hi Samvb,

I totally agree with Drhowarddrfine with his views. The CSS code you are using doesn't have any error but if it not working with modern browsers then it could be markup problem with your document. Please let yourself know first that you are using the same markup code which is compatible to all modern browsers.