Hi guys,

I am a bit stuck! I have a container div (main) holding my 2 content divs (content and sidebar) which has a repeated background vertically. In IE the container grows fluidly with the content in 'content' div, however in firefox it only grows as high as the min-height I've set. Can anyone shed light? Can't see the wood for the trees!

Thanks in advance x

4 answers

-2
points
This was chosen as the best answer

Thanks Dan! I had tried the :after element on the content div to no effect, but adding another child did the job. Thanks again :))

Answered over 7 years ago by chelsey
danwellman 5600
3
points

Try clearing the floats in the content div, either add an empty div as the last child of the container and set it's clear property to both or, preferably, use the :after { content:"."; height:0; visibility:hidden; clear:both; CSS psuedo-element :D

Answered over 7 years ago by danwellman
danwellman 5600
0
points

no worries :D

for ref, the :after needs to go on to the container div that wasn't expanding, rather than a child div within the container; if the container has an id of content, in your stylesheet use:

#content:after { etc...}

Apologies, i should have made that bit clearer

Answered over 7 years ago by danwellman
0
points

No worries I did figure that bit out but it didnt make any difference, tho has inspired me to learn more pseudo elements now so thankyou!

Answered over 7 years ago by chelsey