3 column div layout with wrap

Having issues with div text wrapping

[kiwione]

Hi there,

I'm trying to design a css/div based layout for my site and am having some real issues with tring to get the text content of one div to wrap around another.

I'll readily admit that I'm very new to this whole css business, and am finding it more than a slight challenge :(

I've set up a test site at:

<snip>

What I'm tring to do is to get the text in the Content div "1)" to wrap around the Context div "4)".

I've tried all sorts of combinations of float and margins without success. I'm sure it's probably something very basic, but I'd really appreciate any advice that can be offered.

Many Thanks

[edited by: swa66 at 8:49 am (utc) on Oct. 12, 2009]
[edit reason] No URLs, please see ToS and Forum Charter [/edit]

[swa66]

Welcome to WebmasterWorld!

From what you write your "1"div isn;t floated and your "4" div is floated ?

If so: floated elements do not make their parents stretch by default. There are a number of ways to achieve it. These range from adding overflow:auto on the parent to adding an element that is clearing the floats, but is not floated itself inside the parent

[kiwione]

Thanks swa66 - I'm finding out new things all the time! I'll give the overflow:auto some experimentation.

Sorry, but I didn't quite understand your comment about adding an element that is clearing the floats?

Thanks again

[swa66]

adding an element that is clearing the floats

e.g.
html:

  ...
  <div class="wrapper">
    <!-- floated elements go here -->
    ...
    <br class="clear" />
  </div>
  ...

and the css:
[quote][pre]

.clear {
  clear: both;
  /* do NOT float me */
}
[/quote][/pre]