Grow your CSS skills. Land your dream job.

Centering a wide site in smaller browser window

  • # September 7, 2008 at 8:41 am

    Be gentle, its my first post…

    Does anyone have any suggestions for a work around to center a wide site horizontally in in a smaller browser window?

    I have built the first page of my new site, but as part of the background (transparent png) to the site centers within an auto-centered page-wrap, the site appears to the browser to be much wider than the content. This wide page-wrap div has the effect of making the site content shunt to the right and produce a scroll bar on smaller browser windows, which is rubbish for usability. I need a work around.

    The ideal would be to find the center of the users browser window using javascript, then position the content central on the horizontal scroll bar (i.e move the h scroll bar to the centre). Anyone know how to do this? I can’t find anything on the web after a lot of searching. The only alternative I can see is to make the site page-wrap background holder div appear smaller in width to the browser or comprise the fun 2 part background I am currently using (tile) and centered, semi-transparent page-wrap background.

    (I know this is a big fat wide site and I am making life hard for myself)

    Any solutions or tips really useful. Thanks.

Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.

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