Как центрировать div - PullRequest
       5

Как центрировать div

0 голосов
/ 29 марта 2011

Я хочу установить центр внешнего выравнивания div.Есть некоторый внутренний div, который смещается влево.Таким образом, внешний div не выровнен по центру, мой внутренний div css:

.inner { 
  float:left; 
  margin:10px; 
  border:1px solid #898989; 
  padding:4px;  
  width:200px; 
  background-color:#f2f2f2;
}

Ответы [ 5 ]

0 голосов
/ 06 ноября 2012

Это самый простой метод:

Если вы установили фиксированную ширину и, конечно, правильный DOCTYPE, попробуйте это

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

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

0 голосов
/ 29 марта 2011

почему внутренний div плавает, если он не нужен, просто центрируйте внутренний div?

.inner { 
  margin:10px auto; 
  border:1px solid #898989; 
  padding:4px;  
  width:200px; 
  background-color:#f2f2f2;
}

ИЛИ, если inner плавает, так что он содержит дополнительные float ... тогда вы можете добавить переполнение, скрытое к нему

.inner { 
  overflow: hidden;
  margin:10px auto; 
  border:1px solid #898989; 
  padding:4px;  
  width:200px; 
  background-color:#f2f2f2;
}

или вы можете превратить внутренний элемент во встроенный блок - и обернуть его в div с помощью text-align: center;

<div class="outer">
<div class="inner"><span>float</span>the inner text</div>
<div class="inner"><span>float</span>the inner text</div>
<div class="inner"><span>float</span>the inner text</div>
<div>

.inner { 
  display: inline-block;
  margin:10px; 
  border:1px solid #898989; 
  padding:4px;  
  width:200px; 
  background-color:#f2f2f2;
}

.inner {display: inline !ie7;}

span {float: left; width: 50px; height: 50px; background: #ffe;}

.outer {text-align: center;}
0 голосов
/ 29 марта 2011

Самый простой способ - установить горизонтальные поля на auto:

<div style="margin-left: auto; margin-right: auto;">Content</div>

Но это также зависит от атрибута float.Поскольку я не знаю, что еще у вас есть на вашем сайте, я могу порекомендовать вам попробовать разные атрибуты с плавающей точкой (слева, справа, нет).

Удачи!:)

0 голосов
/ 29 марта 2011

попробовать:

<div align="center" style="clear:left"> 
...
</div>
0 голосов
/ 29 марта 2011

Без каких-либо подробностей в вашем вопросе все, что я могу предложить, это

<div style='margin: 0px auto;'>Blah</div>

Но это скорее зависит от того, что еще у вас происходит.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...