Не может центрировать div горизонтально

Да, есть другие вопросы по этому поводу; но я не могу сделать этот центр, следуя их инструкциям. Зачем?Не может центрировать div горизонтально

HTML

<!doctype html> 
<html> 
    <head> 
     <link rel="stylesheet" type="text/css" href="css/style.css"> 
    </head> 
    <body> 
     <div> 
      <div class="center"></div> 
     </div> 
    </body> 
</html>

CSS:

body { 
    line-height: 1; 
} 

.center { 
    position: fixed; 
    display: block; 
    margin-left: auto; 
    margin-right: auto; 
    width: 300px; 
}

источник

2013-06-12 Andrew B Schultz

Имеет ли ваш документ объявление doctype? – Matthew

Нет необходимости в дополнительном div ... – poke

Matthew - страница HTML. Poke - не так, как есть. Я пытался создать div снаружи, который имел цвет фона, а затем центрировал мой внутренний div в этом внешнем div. –

position: fixed делает саму позицию Div абсолютно (и фиксированной, что делает его остаться там, где это при прокрутке). Это означает, что автоматическая маржа не будет работать. Вы можете это исправить, удалив правило положения, либо путем размещения DIV абсолютно вместо:

.center { 
    position: fixed; 
    width: 300px; 
    left: 50%; 
    margin-left: -150px; 
}

На несвязанной ноте, дополнительный div совершенно бесполезно, вы можете просто оставить это. Кроме того, divs являются блочными элементами по умолчанию, поэтому вы также можете оставить правило display: block;.

источник

2013-06-12 23:40:51 poke

Спасибо, poke, это ответ, который я искал. У меня это исправлено, потому что я не хочу, чтобы он прокручивался, но хотел, чтобы он был сосредоточен на странице. –

Изменение position:fixed; к position:relative;

источник

2013-06-12 23:38:54 established82

Удалите position: fixed от стиля дивы.

Кроме того, вам не нужен дисплей: блок ... он должен по умолчанию быть таким же. И тыкать правильно, вам не нужен дополнительный div.

Вот пример его работы ... http://jsfiddle.net/VYmw6/1/

источник

2013-06-12 23:39:12 Charlino

Ваш div не будут сосредоточены, потому что у вас есть position:fixed, если вы удалите, что он будет работать. :)

См JSfiddle здесь: http://jsfiddle.net/6XWMR/

источник

2013-06-12 23:39:21 user2019515

есть ли причина, по которой вы использовали position: fixed? но все равно надеюсь, что это поможет вам

CSS:

.center { 
    margin: 0 auto; 
    width: 300px; 
}

Demo

источник

2013-06-13 00:28:20 jhunlio

-1

Изменить код для

<center> 
    <div> 
      content 
    </div> 
</center>

В основном, заключите DIV, который вы хотите, чтобы по центру внутри тега.

Надеется, что это помогает, и все самое лучшему с вашим проектом :-)

источник

2013-06-13 07:45:03

В наши дни никто не использует тег «center». Если вы это сделаете, я даже не знаю, с чего начать с моих комментариев ... – amn

Downvoted, '

' устарел. – user2019515

Используйте его!

.center { 

margin-left: auto; 
margin-right: auto; 
width: 300px; 
} 

or 

.center { 

margin:0 auto; 
width: 300px; 
}

Это Fiddle !!

источник

2013-06-13 07:57:59 zey

Нет необходимости указывать «display: block» для элемента «div», они по умолчанию отображаются как элементы блока. По крайней мере, согласно рекомендованной таблице стилей по умолчанию, указанной в спецификации CSS 2.1 по адресу http://www.w3.org/TR/CSS21/sample.html – amn

Спасибо amn :), я отредактировал свой ответ! – zey

Не может центрировать div горизонтально

ответ

Смежные вопросы