text wrap around mutliple divs

[figrin]

Hi,

I have two divs/images/tables (content type not fully defined yet ;)). Both have to be on the left, with the 2nd div position a certain distance underneath the 1st div.

Is there a way to wrap text around both divs?

e.g. pardon my ascii art

----------------------
¦..........¦ text text text¦
¦.div1.¦ x x x x x x x¦
¦..........¦ x x x x x x x¦
¦------- x x x x x x x¦
¦ x x x x x x x x x x ¦
¦ x x x x x x x x x x ¦
¦------- x x x x x x x¦
¦..........¦ text text text¦
¦.div2.¦ x x x x x x x¦
¦..........¦ x x x x x x x¦
----------------------

[SuzyUK]

Hi figrin - Welcome to WebmasterWorld

I don't think there is.. that is and still have a precise distance betwwen the two divs, especially if you don't know what the content of these divs are.

about the only thing I can think of is that you can have your first <p>aragraph with the div 1 floated left inside it.. then pick another paragraph at a suitable distance down the page and float the div 2 inside it the same way..

take a look at the recommendations for the float property [w3.org] and the diagrams at the end of section 9.5.. these show how a float will act on adjacent paragraphs.

Unless someone else has any ideas?

Suzy

[ktwilight]

am still trying to master div using css, so please pardon my errors, and do correct me... ^^;;

it's possible, i'm using a few div and span tags to position where i want, and also create a layout...
i think, it's possible to do it this way...

<div class="main">
<div class="div1">
<span class="text1">text 1 here</span>
</div>
<div class="div2">
<span class="text2">text 2 here</span>
</div>
</div>

if i ain't wrong, your css style should be like this

div.main {
padding-left: 10%;
float: left;
}
div.main div1 {
text-align: left;
}
div.main div2 {
text-align: left;
}
div.main div1.text1 {
text-align: right;
}
div.main div2.text2 {
text-align: right;
}

and it should look exactly, after putting in the necessary variables in, like what you want... ^^;

i hope it works... >.< this is off the top of my head, i didn't test it...'cuz i've just finished coding up my css for my website, and it looks great with multiple div and span in one main div tag... ^^

[figrin]

thanks everyone for their replies :)

Does it matter that I don't know what is in the content of the divs? Shouldn't the div acts as a container and keep the content inside the div separate to the text wrapping around it. All that should be constant is the distance between the two divs, and that I can define.

Also the text has to be one uniform block. If I split the text up into multiple blocks then the height difference between the two divs are based on the <p> tags and not due to the css positioning.