I am working on a web page that contains both table and div tag to handle alignment. When I view the page in IE7 the page alignment is centered and works as expected.

When I view the page in Fire Fox, Chrome and Safari the everything on the page is pushed to the left.

My primary attribute to align the page elements is the text-align: center; in the body tag and the first div tag on the page.

What can I do to fix the alignment to center all page elements through out all browsers?

1 answer

Kau-Boy 110
1
point
This was chosen as the best answer

Do you want to center only the main div tag? Then you should use a margin: 0 auto on the div.

But beside that: If you want to center something with text-align: center; that "something" must not be a block element. You can make an element a inline element using display: inline; or display: inline-block;. If you want to center something within a div you also have to make the div display: table-cell; as text-align: center; does not work on divs with display: block;

Answered over 6 years ago by Kau-Boy
  • Thanks. The `margin: 0 auto` attribute in my `body` tag fixed my issue. Michael Kniskern over 6 years ago