Центральная колонка CSS, которая работает в FF и IE9?

Question

Я абсолютно новичок в макетах CSS, но я пытаюсь просто начать базовый, который является просто центральным столбцом с фиксированной шириной (всего один div), чтобы стороны были гибкими. Я знаю, что это не реагирует / реагирует, но я только начинаю.

Итак, я пробовал найти множество примеров, но не могу найти отправную точку, которая работает как на FF, так и на IE9? Я имею в виду только начало, и они разные?

Вот последний пример простого стиля, который я попробовал:

* { padding: 0; margin: 0; }

body {
 font-family: Arial, Helvetica, sans-serif;
 font-size: 13px;
 background: #f5f5f5;
}
#wrapper { 
 margin: 0 auto;
 width: 922px;
}
#content { 
 width: 900px;
 color: #333;
 border: 0px solid #f5f5f5;
 background: white;
 margin: 0px 0px 0px 0px;
 padding: 10px;
 height: 600px;
}

так что это самое начало, но уже FF показывает это по центру, а IE нет. Так что уже все, что я пытаюсь (т.е. слева:50% и margin-right:-461px, как я нашел в качестве примера) влияет на это по-разному. Я читал повсюду, это очень распространенная проблема, но я боюсь, что здесь есть какая-то основополагающая логика, о которой я не знаю?

любая помощь в этом с благодарностью!

РЕДАКТИРОВАТЬ: Спасибо за комментарий! У меня есть следующее, который снова работает в IE (и в Chrome), но не FF?

CSS:

* { padding: 0; margin: 0; }

body {
 font-family: Arial, Helvetica, sans-serif;
 font-size: 13px;
 background: #f5f5f5;
}
#wrapper { 
 margin: 0 auto;
 width: 922px;
 margin-left:auto;
 margin-right:auto;

}
#content { 
 width: 900px;
 color: #333;
 border: 2px solid #f5f5f5;
 background: white;
 padding: 10px;
 height: 600px;
 position:absolute;
 left:50%;
 margin-left:-461px;
}

#welcomeBanner{
    text-align:center;
    font-family:"segoe ui light","segoe ui","segoe";
    font-size:18pt;
    padding-top:20px;
    padding-bottom:20px;
    margin-top:0px;
}

html: буквально только:

    <div id="wrapper">
        <div id="content">
            <div id="welcomeBanner">Attempting to Learn This Stuff<div>
        </div>
    </div>

поэтому в IE9 и Chrome я получаю заголовок по центру, большой квадрат в центре фиксируется фоновым цветом и т. д. В FF ничего нет. Мне нравится, что к странице вообще не применяется стиль? Я использую тег ссылки в голове, но он, очевидно, там и работает для других?

Answer 1

body {
    width:100%
}

div {
    width: 900px;
    margin:0 auto;
}

должно сработать

cf Центрирование Div в IE9 Используя margin:auto