I’m working on a site which has some big images etc to show. On my screen, at 1024 x 768 resolution, it fits the screen completely, going from left to right.
However on my client’s screen, who has a bigger resolution, he sees the right part of the screen as blank, and wants me to center the layout rather than have it be left aligned. (I have my margin-left set to 0.)
If I simply increase the margin-left, it will cause a horizontal scrollbar to appear on lower resolutions like mine.
Is there any way to solve this that will work on all resolutions? Or do I have to resort to using javascript which will detect screen resolution, and increase the margin-left if the resolution is bigger than a certain value?
this will horizontally center an element with id=”wrapper”, so if all your content is inside that element, your page will be centered
basically if you apply margin-left: auto; and margin-right: auto; to a block element, it will be centered horizontally