Grow your CSS skills. Land your dream job.

Div Acting Strange Unless Floated Left, which causes new issues

  • # August 9, 2012 at 10:42 pm

    http://goo.gl/ZciQu

    The #page div is supposed to be centered on the page, however when you remove the “float: left” from the div, it no longer auto-stretches in height. If you view it in Firebug, you will see that without the “float: left”, the #page div ends behind the slideshow instead of extending down.

    Any ideas?

    # August 9, 2012 at 11:06 pm

    Instead of using float: left; use overflow: hidden; which will clears the floats on your child elements allowing it to be centered and the full length it needs to be.

    # August 9, 2012 at 11:17 pm

    I think he’ll need to use the clearfix method here as the slideshow banner image is overflowing the page width. Or, add clear: both to the hr at the bottom of #page (and remove the display: none and color it white).

    # August 9, 2012 at 11:32 pm

    @Sgtlegend – Nice! Thanks, but @WolfCry was right about the slideshow. But instead of using clear:both, I’m just going to move the #slideshow above the #page div.

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".