Встроенный CSS не центрируется <div>

Question

Я читал другие вопросы о стекопереработке о центрировании и использовал эту технику раньше.

Я пытался использовать:

<div style="width: 1000px; position: absolute; margin: 300px auto 0px auto;">
content in here
</div>

Это не центрирует div. Что я сделал не так? Я чувствую, что раньше использовал этот код, но на этот раз он не сработает. Я попытался создать новый HTML-файл, и я попробовал это в случае, если я сделал что-то не так на этой конкретной странице. Это также было ошибкой. Как это неправильно?

Answer 1

Избавиться от position: absolute.

jsFiddle .

Кстати, это никак не связано с тем, что стили встроены.

Answer 2

Трюк с автоматическим запасом не работает для элементов с абсолютным позиционированием. Вместо этого попробуйте следующее:

width: 1000px;
position: absolute;
top: 300px;
left: 50%;
margin-left: -500px;

Это работает, центрируя LHS элемента, используя left: 50%, затем центрируя элемент, используя отрицательное поле равное половине его ширины.