[kam2701]

Hi im trying to tidy some code from my first ever web site.

Im trying to make the wrapper and content divs expand as need be so im declaring height: auto

Howerver it doesnt auto expnad and now ive lost its white background.

Im really not sure what the problem is.

Can you see what im doing wrong ?

http://www.efficient...t/services.html

[gfxpixeldesigns]

Id try removing the height completely since its a wrapper it shouldnt need a height property it will adjust itself, i think

[kam2701]

gfxpixeldesigns, on Apr 14 2009, 13:46, said:

Id try removing the height completely since its a wrapper it shouldnt need a height property it will adjust itself, i think

I gave that a try but same problem. Never had so much hassle with a wrapper :-(

[Meow]

Try floating the wrapper div if you're floating content divs inside it.

[kam2701]

cinnamondm, on Apr 14 2009, 14:29, said:

Try floating the wrapper div if you're floating content divs inside it.

Hi that worked . Thank you :-)

The only prob though is because ive floated it left it´s on the left hand side of the page. It should be in the middle.

I have left and right margins set to auto though?

[Meow]

Is it your outermost wrapper? You may need to add another outside that one that doesn't need to float or be styled, just so as you can set auto margins to centre it.

For example, mine is structured as (with a bit of artistic license paid to the labelling!)

<div wrapper-with-auto-margins>
<div header></div>
<wrapper-that-floats-to-show-the-correct-background->
<div left-content></div>
<div right-content></div>
</div>
<div footer></div>
</div>

[mr p]

there's a trick using <br /> that should solve it.

pop the margin: 0 auto; back on the wrapper and remove the float, then add <br class="clearMe" /> (class it how you like) at the bottom of your wrapper after the content.

style = br.clearMe {clear: both; height: 0}

[Meow]

mr p, on Apr 14 2009, 18:53, said:

there's a trick using <br> that should solve it.

pop the margin: 0 auto; back on the wrapper and remove the float, then add <br class="clearMe"> (class it how you like) at the bottom of your wrapper after the content.

style = br.clearMe {clear: both; height: 0}

That's interesting. I'd tried using clearing divs to no avail, but not using a br with it.

[mr p]

cinnamondm, on Apr 14 2009, 18:56, said:

That's interesting. I'd tried using clearing divs to no avail, but not using a br with it.

were the divs empty? maybe that's why they didn't work.

using <br /> in this way after a load of floated content gives the wrapper a way of knowing where the content ends, i assume this is because <br /> is treated as content. not sure if empty divs are treated the same.

[Meow]

mr p, on Apr 14 2009, 19:09, said:

were the divs empty? maybe that's why they didn't work.

Yes and no! Tried them with the comment inside <!-- --> which I thought was a way of fooling it into thinking it wasn't empty. However, I suspect the br is more 'solid' content for it.

[kam2701]

mr p, on Apr 14 2009, 14:53, said:

there's a trick using <br /> that should solve it.

pop the margin: 0 auto; back on the wrapper and remove the float, then add <br class="clearMe" /> (class it how you like) at the bottom of your wrapper after the content.

style = br.clearMe {clear: both; height: 0}

Yeah that worked. Dont have a clue why but it works :-)