| tzulah@gmail.com 2006-02-26, 3:14 am |
| I have a div box with a floating image inside, which I reposition to
look like it is partially outside the box and overlapping slightly. I
now want the text inside the div box to wrap around the portion of the
image that covers the box. Is this possible? So far, all I've
accomplished is either (a) text is buried underneath the image, or (b)
text wraps around the space the image would have been if I hadn't moved
it, which looks ridiculous of course.
Surely somebody must have tried this before. Is it possible? My code
looks something like this:
#textbox {
border: 2px solid #000000;
position: relative;
width: 320px;
left: 200px;
top: 200px;
text-align: left;
}
#textbox p img {
display: inline;
float: left;
text-align: left;
border: thin solid #FF0000;
position: relative;
top: -200px;
left: -200px;
}
<div id='textbox'>
<p>
<img src="images/picture.png" />
title line<br />
line 1<br />
line 2<br />
line 3<br />
line 4 <br />
line 5<br />
line 6<br />
line 7<br />
line 8<br />
line 9<br />
line 10<br />
line 11<br />
line 12<br />
line 13<br />
line 14<br />
line 15<br />
line 16<br />
line 17<br />
line 18<br />
line 19<br />
line 20<br />
line 21<br />
line 22
</p>
</div>
Thanks for any advice!
|