Home/ Questions/Q 9202825
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-17T23:20:26+00:00

I am working on a website, and am experiencing some issues between browsers. Some

  • 0

I am working on a website, and am experiencing some issues between browsers. Some browsers show the site perfectly centered, with a black border on the left and right. Other browsers show it aligned left, with no black border on the left side, and a larger one on the right. Suggestions on how I can set the HTML or CSS to align properly across all browsers?

More info:

It looks like it is centered on PC, but not on Mac. A friend has a PC that it does center, and on my Mac it is not. The address is bellfortchurchofchrist.com

UPDATE: Added some code suggested by the answer below, and here it is on a PC:

enter image description here

Here it is on my Mac on Safari:

enter image description here

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    This is an answer to the alignment issue, I don’t know what you mean about the border, for me in Chrome on OS X the site has a black background with no border.

    To fix the alignment you need to put the whole website into a wrapper <div> tag and give that wrapper the following styles:

    width:1000px; margin:auto; position:relative;

    The tag should start immediately after <body> and close right before </body>.

    This will give the website a fixed width, centre it using margin and position:relative will mean your absolute positioned <div> tags will anchor off the wrapper.

    The site’s build in quite an inflexible way, it’s better to stack and float elements naturally than absolute position ever element in the website. It means you could come across issues with a whole range of browsers and within mobile devices.

    If you can clarify the border issue I can probably provide a solution to that as well.

    • 0