Центрировать div в CSS - программирование
Подтвердить что ты не робот

Центрировать div в CSS

Я пытаюсь настроить центр новостей (в нижнем контейнере div) на этой странице:

http://www.luukratief-design.nl/dump/parallax/index.html

У меня уже есть text-align: center;

Тем не менее он не работает.

Любые предложения?

4b9b3361

Ответ 1

text-align: center; центрирует только элемент встроенного содержимого, а не сам элемент.

Если это элемент (a div is), вам нужно установить margin: 0 auto;, иначе, если это встроенный элемент, вам нужно установить text-align: center; в свой родительский элемент.

margin: 0 auto; установит верхнее и нижнее поле на 0, а левое и правое поле - на auto (того же размера), чтобы оно автоматически помещалось в центр. Это работает только в том случае, если рассматриваемый элемент блока имеет известный width (как фиксированный, так и относительный), иначе он не может определить, где начинать и заканчивать.

Ответ 2

text-align не следует использовать для центрирования элемента блока. (за исключением IE6, но это bug)

Вы должны исправить ширину блока, затем использовать margin: 0 auto;

#block
{
   width: 200px;
   border: 1px solid red;
   margin: 0 auto;
}

и

<div id="#block">Some text... Lorem ipsum</div>

Ответ 3

Один из способов:

<div align="center">you content</div>

Лучший способ:

<div id="myDiv">you content</div>

CSS для myDIV:

#myDiv{
margin:0px auto;
}

Ответ 4

добавить

margin:auto;

Ответ 5

Я всегда использую

<div align="center">Some contents......</div>

Ответ 6

Установлена ​​ширина, и вы установите правильный DOCTYPE,

Попробуйте следующее:

 Margin-left: auto;
 Margin-right: auto;

Надеюсь, что это поможет

Ответ 7

Попробуйте добавить это в стиль.

margin-left: auto;

Ответ 8

Попробуйте следующее:

#bottombox {
background:transparent url(../images/bg-bottombox.png) no-repeat scroll 0 0;
float:none;
height:137px;
margin:0 auto;
padding-top:14px;
width:296px;
}

Это должно центрировать div в нижнем колонтитуле.

Ответ 9

Используйте text-align: center для контейнера, display: inline-block для обертки div и display: inline для содержимого div для горизонтального центра содержимого с шириной undefined в браузерах:

    <!doctype html>
    <html lang="en">
    <head>
      <style type="text/css">

    /* Use inline-block for the wrapper */
    .wrapper { display: inline-block; }

    .content { display:inline; }

    .container { text-align:center; }

    /*Media query for IE7 and under*/

    @media,
      {
      .wrapper { display:inline; }
      }
        </style>

        <title>Horizontal Centering Test</title>
    </head>

    <body>

      <div class="container">
        <div class="content">
            <div class="wrapper">
              test text
            </div>
        </div>
      </div>
    </body>
    </html>

Ответ 10

Создайте таблицу с одной строкой и тремя столбцами, установите ширину влево и вправо на 100% и вуаля, средний будет автоматически центрироваться.