Home/ Questions/Q 6731411
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-26T10:31:32+00:00

Here’s what I’m aiming for, working 100% correctly in Firefox 7 . When I

  • 0

Here’s what I’m aiming for, working 100% correctly in Firefox 7.

enter image description here

When I open it in IE 8, it displays like this:

enter image description here

Here’s the basic layout:

<div id="header-home">
    <div id="header-content">
    </div>
</div>

With all of the elements inside of the #header-content.

Here’s the relevant HTML and CSS hosted on JSFiddle. If you stretch the preview pane you’ll see the contents are centered correctly on Firefox.

http://jsfiddle.net/stapiagutierrez/agURs/

Why is IE not centering the div as it should?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    IE falling back to quirks mode if you don’t have doctype in your html. And in quirks mode margin auto; didn’t works.

    Adding doctype can solve it.

    Right doctype and header for xhtml (so xml-readers can understand that it is xml and can parse it) is:

    <?xml version="1" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    But if you place xml line before DOCTYPE line, IE will not accept it (as it thinks that doctype is always first line of document). So to make it work in IE you should write: 

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<?xml version="1" encoding="UTF-8"?>

    or just: 

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    • 0