Member Avatar for suavedesign

I am having a hard time figuring out why the inner pages of my website are not centered when viewed in IE (IE10 is fine, the older versions are giving me the problem.) Although the home page is centered, it ignores the

margin:0 auto;

on the inner pages.
This is the link:
Thanks.

  • 2 Contributors
  • 2 Replies
  • 106 Views
  • 16 Minutes Discussion Span
  • Latest Post Latest Post by suavedesign

Dani AI

Generated

Nice catch by — fixing the page framing in this thread required correcting the document setup. Additional notes and practical checks for anyone who runs into the same symptom in older IE:

  • Confirm the markup actually starts where it should. Open the inner page source and verify the very first bytes are the document declaration (no blank lines, no stray HTML, and no UTF-8 BOM before it). Server-side includes or PHP files that emit whitespace before the header are a common culprit.
  • Use IE's developer tools (F12) to see the active Document Mode. If the page is rendering in an older mode, check for compatibility settings or headers that force older engines.
  • Prevent compatibility overrides by supplying an appropriate X-UA-Compatible header or meta early in the head, and ensure server headers are not sending a conflicting value.
  • Check the layout/CSS context: the centering container needs an explicit width and must not be a float or inline parent. In very old IE (6/7) you may need to trigger layout on the container.

Below are two short snippets that help with the two points above (meta to prefer the newest engine, and a robust centering pattern that avoids the shorthand shown earlier):

<meta http-equiv="X-UA-Compatible" content="IE=edge">
.wrapper {
  width: 960px;
  margin-left: auto;
  margin-right: auto;
  /* for IE6/7 layout trigger */
  zoom: 1;
}

Finally, validate the page with a markup validator and re-check any server-side templates that produce the inner pages. The behavior you saw (homepage OK, inner pages not) usually means a small difference in the generated output rather than a mysterious CSS bug.

Recommended Answers

All 2 Replies

Member Avatar for JorgeM

It seems that you may have forgotten to include the doctype decleration for some of your pages.

The doctype is still important specifically for IE. When there is no doctype declared, IE goes into quirks mode.

You need to simply add the doctype.. It looks like from the link you posted above you are using XHTML 1.0 Transitional as your doctype. You should consider using the HTML5 doctype on your new projets. declarling a doctype of HTML5 doesnt mean you have to include HTML5 elements right away..

The HTML5 doctype is easier to use because its simple...

<!DOCTYPE html>

Edited by JorgeM
Member Avatar for suavedesign

wow! that was it! thanks a million!!!

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.