CSS - Best method to wrap text around an image

Take a look at image 1.  Here, I've done nothing but floated the image right:
img {
	float: right;
	display: block;
}

Open in new window

This is problematic because the text runs under the image.  Now, take a look at image 2.  Here, I've added some margin settings:
i
mg {
	float: right;
	display: block;
	margin: 100px 0 30px 30px;
}

Open in new window

This is better; the text no longer runs under the image, but the text also doesn't run above the image.  I'm trying to get the text to run above the image, but not under the image.  What's the best way to accomplish this?  The two samples are located here:

http://jaginc.com/dev/EEPostings/sample1.html
http://jaginc.com/dev/EEPostings/sample2.html
sample1.png
sample2.png
jdanaAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Tom BeckCommented:
A working example.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Text Wrap</title>
    
</head>
<body>
<div style="float:left;width:0px;height:12em;"></div>
<div style="width:20%;height:20%;border:solid 1px green;font-style:italic;float:left;display:block;background-color:#fff;padding:10px;clear:left;margin:1em;">"
am curtail'd of this fair proportive tricks,Our steeds To the souls of our house In the lascivious pleasing nymph;I, that am not shaped front; And all the lascivious pleasing of the winter of the deep bosom of our house In the lascivious sun of York; And now, instead of York; And now, instead of our bruised arms
</div>
<div style="width:98%;height:98%;border:solid 1px black;padding:10px;">
am curtail'd of this fair proportive tricks,Our steeds To the souls of our house In the lascivious pleasing nymph;I, that am not shaped front; And all the lascivious pleasing of the winter of the deep bosom of our house In the lascivious sun of York; And now, instead of York; And now, instead of our bruised arms hung up for sportion, of this sun of this sun of fearful marches to merry meeting of fearful marches to merry meeting of York; And all the lascivious wrinkled for monuments; I, that am curtail'd of a lady's chamber To frightful adversaries, He capers nimbly in a lute. But I, that lour'd upon our bruised arms hung up for sportion, fair proportion, r discontent Made to delightful marches to merry meeting barded stern alarums chamber To the lascivious wrinkled for sportion, love's majesty To strut before a want lour'd upon our dreadful adversaries, Nor made glorious pleasing nymph; I, that love's majesty To fright the lascivious sun of mounting of this wreaths; I, that am not shaped for made to delightful marches to delightful marches to court an ambling nymph; I, that am not shaped front; And now, instead of mountings, Now are our brows bound with victorious pleasing barded steeds To strut before a want love's majesty To frightful adversaries, Our steeds To the souls of a lute. But I, that lour'd upon our dreadful adversaries, Our dreadful marches to court an amorous looking-glass; Our steeds To frightful adversaries, Our discontent Made to merry meeting nymph; I, that am not shaped front; And now, instead of our house In the winter of fearful marches to court an ambling nymph; I, that am rudely stamp'd, and with victorious wreaths; Our dreadful marches to delightful adversaries, Our steeds To frightful marches to court an amorous pleasing barded stern alarums chamber To strut before a wanton ambling of fearful marches to court an amorous looking-glass; I, that love's majesty To the winter of York; And all the deep bosom of York; And now, instead of this sun of the deep bosom of our dreadful measures. Grim-visaged war hath smooth'd his fair proportion, his summer by this wrinkled front; And now, instead of York; And all the souls of York; And now, instead of York; And all the clouds the souls of our brows bound war hath smooth'd his sun of a lute. But I, that am rudely stamp'd, and with victorious pleasing barded stern alarums chamber To strut before a want lour'd upon our bruised arms hung up for made glorious pleasing nymph; I, that am not shaped front; And now, instead of this fair proportive tricks, Our bruised arms hung up for sportive tricks, Now is that am rudely stamp'd, and war hath smooth'd his wrinkled for sportion, ith victorious looking-glass; Our bruised arms hung up for made glorious wreaths; I, that lour'd upon our discontent Made glorious wreaths; I, that am not shaped for sportive tricks, Now is the deep bosom of York; And now, instead of our house In the ocean buried. Now is that love's majesty To the deep bosom of fearful measures. Grim-visaged wanton ambling of mounting nymph; I, that am rudely stamp'd, and wanton ambling nymph; I, that am curtail'd of this fair proportive tricks, Our stern alarums changed to delight the souls of the lascivious sun of mountings, Our steeds To fright the souls of the ocean buried. Nor made glorious wrinkled front; And all the souls of York; And all the souls of this wrinkled front; And all 
am curtail'd of this fair proportive tricks,Our steeds To the souls of our house In the lascivious pleasing nymph;I, that am not shaped front; And all the lascivious pleasing of the winter of the deep bosom of our house In the lascivious sun of York; And now, instead of York; And now, instead of our bruised arms hung up for sportion, of this sun of this sun of fearful marches to merry meeting of fearful marches to merry meeting of York; And all the lascivious wrinkled for monuments; I, that am curtail'd of a lady's chamber To frightful adversaries, He capers nimbly in a lute. But I, that lour'd upon our bruised arms hung up for sportion, fair proportion, r discontent Made to delightful marches to merry meeting barded stern alarums chamber To the lascivious wrinkled for sportion, love's majesty To strut before a want lour'd upon our dreadful adversaries, Nor made glorious pleasing nymph; I, that love's majesty To fright the lascivious sun of mounting of this wreaths; I, that am not shaped for made to delightful marches to delightful marches to court an ambling nymph; I, that am not shaped front; And now, instead of mountings, Now are our brows bound with victorious pleasing barded steeds To strut before a want love's majesty To frightful adversaries, Our steeds To the souls of a lute. But I, that lour'd upon our dreadful adversaries, Our dreadful marches to court an amorous looking-glass; Our steeds To frightful adversaries, Our discontent Made to merry meeting nymph; I, that am not shaped front; And now, instead of our house In the winter of fearful marches to court an ambling nymph; I, that am rudely stamp'd, and with victorious wreaths; Our dreadful marches to delightful adversaries, Our steeds To frightful marches to court an amorous pleasing barded stern alarums chamber To strut before a wanton ambling of fearful marches to court an amorous looking-glass; I, that love's majesty To the winter of York; And all the deep bosom of York; And now, instead of this sun of the deep bosom of our dreadful measures. Grim-visaged war hath smooth'd his fair proportion, his summer by this wrinkled front; And now, instead of York; And all the souls of York; And now, instead of York; And all the clouds the souls of our brows bound war hath smooth'd his sun of a lute. But I, that am rudely stamp'd, and with victorious pleasing barded stern alarums chamber To strut before a want lour'd upon our bruised arms hung up for made glorious pleasing nymph; I, that am not shaped front; And now, instead of this fair proportive tricks, Our bruised arms hung up for sportive tricks, Now is that am rudely stamp'd, and war hath smooth'd his wrinkled for sportion, ith victorious looking-glass; Our bruised arms hung up for made glorious wreaths; I, that lour'd upon our discontent Made glorious wreaths; I, that am not shaped for sportive tricks, Now is the deep bosom of York; And now, instead of our house In the ocean buried. Now is that love's majesty To the deep bosom of fearful measures. Grim-visaged wanton ambling of mounting nymph; I, that am rudely stamp'd, and wanton ambling nymph; I, that am curtail'd of this fair proportive tricks, Our stern alarums changed to delight the souls of the lascivious sun of mountings, Our steeds To fright the souls of the ocean buried. Nor made glorious wrinkled front; And all the souls of York; And all the souls of this wrinkled front; And all 
am curtail'd of this fair proportive tricks,Our steeds To the souls of our house In the lascivious pleasing nymph;I, that am not shaped front; And all the lascivious pleasing of the winter of the deep bosom of our house In the lascivious sun of York; And now, instead of York; And now, instead of our bruised arms hung up for sportion, of this sun of this sun of fearful marches to merry meeting of fearful marches to merry meeting of York; And all the lascivious wrinkled for monuments; I, that am curtail'd of a lady's chamber To frightful adversaries, He capers nimbly in a lute. But I, that lour'd upon our bruised arms hung up for sportion, fair proportion, r discontent Made to delightful marches to merry meeting barded stern alarums chamber To the lascivious wrinkled for sportion, love's majesty To strut before a want lour'd upon our dreadful adversaries, Nor made glorious pleasing nymph; I, that love's majesty To fright the lascivious sun of mounting of this wreaths; I, that am not shaped for made to delightful marches to delightful marches to court an ambling nymph; I, that am not shaped front; And now, instead of mountings, Now are our brows bound with victorious pleasing barded steeds To strut before a want love's majesty To frightful adversaries, Our steeds To the souls of a lute. But I, that lour'd upon our dreadful adversaries, Our dreadful marches to court an amorous looking-glass; Our steeds To frightful adversaries, Our discontent Made to merry meeting nymph; I, that am not shaped front; And now, instead of our house In the winter of fearful marches to court an ambling nymph; I, that am rudely stamp'd, and with victorious wreaths; Our dreadful marches to delightful adversaries, Our steeds To frightful marches to court an amorous pleasing barded stern alarums chamber To strut before a wanton ambling of fearful marches to court an amorous looking-glass; I, that love's majesty To the winter of York; And all the deep bosom of York; And now, instead of this sun of the deep bosom of our dreadful measures. Grim-visaged war hath smooth'd his fair proportion, his summer by this wrinkled front; And now, instead of York; And all the souls of York; And now, instead of York; And all the clouds the souls of our brows bound war hath smooth'd his sun of a lute. But I, that am rudely stamp'd, and with victorious pleasing barded stern alarums chamber To strut before a want lour'd upon our bruised arms hung up for made glorious pleasing nymph; I, that am not shaped front; And now, instead of this fair proportive tricks, Our bruised arms hung up for sportive tricks, Now is that am rudely stamp'd, and war hath smooth'd his wrinkled for sportion, ith victorious looking-glass; Our bruised arms hung up for made glorious wreaths; I, that lour'd upon our discontent Made glorious wreaths; I, that am not shaped for sportive tricks, Now is the deep bosom of York; And now, instead of our house In the ocean buried. Now is that love's majesty To the deep bosom of fearful measures. Grim-visaged wanton ambling of mounting nymph; I, that am rudely stamp'd, and wanton ambling nymph; I, that am curtail'd of this fair proportive tricks, Our stern alarums changed to delight the souls of the lascivious sun of mountings, Our steeds To fright the souls of the ocean buried. Nor made glorious wrinkled front; And all the souls of York; And all the souls of this wrinkled front; And all 
</div>
</body>
</html>

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Dave BaldwinFixer of ProblemsCommented:
The second image is just doing what you told it to.  Try these settings instead.
img {
	float: right;
	display: block;
	margin: 0px 0px 10px 10px;
}

Open in new window

0
jdanaAuthor Commented:
Thanks!
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
CSS

From novice to tech pro — start learning today.