The Lodge is members-only design/dev videos and Office Hours.

Next Office Hours Session: "Implementing an SVG Icon System" Nov 30 - 6:00 PM Eastern

background image alignment

  • # May 4, 2009 at 7:24 am


    We have a problem here thats just sucking the time out of us…

    The background picture is repeated all the way to the bottom of the page and center aligned. Its this center alignment thats giving different results in different web browsers as it doesn’t always completely line up with the edges of the columns.

    Thought about using an image in the container that is left justified (then we have fine pixel control) but when the content is too short, there is a gap at the bottom of the page.

    Thanks very much in advance.

    # May 4, 2009 at 8:13 am

    Not being able to put the bg in a container, kind of hamstrings you a bit.
    You could try this:

    html {

    Which is based on this article

    # May 4, 2009 at 10:01 am

    That solution didn’t seem to work. But we got it solved. Put the image background in the container div and set the height and min-height to 100%. Also added a footer with the same background image.

    Thanks for the reply anyway.

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

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed