将div与中心对齐

Question

我想漂浮div到中心.可能吗？text-align: center在IE中不起作用.

Answer 1

本身没有浮动中心.如果你想将一个块元素置于另一个块中心,请执行以下操作

<div id="outer">
  <div id="inner">Stuff to center</div>
</div>

有:

#outer { width: 600px; }
#inner { width: 250px; margin: 0 auto; }

现在,这不会使文本环绕它(就像它向左或向右浮动),但就像我说:没有浮动中心.

Answer 2

这一直对我有用.

如果为DIV和正确的DOCTYPE设置固定宽度,请尝试此操作

div {        
  margin-left:auto;
  margin-right:auto;
}

希望这可以帮助.

Answer 3

通常的技术是 margin:auto

但是,旧IE不会理解这一点,因此通常会添加text-align: center到外部包含元素.您不会认为这会起作用,但忽略的IE auto也会错误地将文本对齐中心应用于块级内部元素,以便解决问题.

而这实际上并没有真正的浮动.

Answer 4

浮动div到中心"工作"与display:inline-block和text-align:center的组合.

尝试通过调整此jsfiddle的窗口来更改外部div的宽度

<div class="outer">
    <div class="block">one</div>
    <div class="block">two</div>
    <div class="block">three</div>
    <div class="block">four</div>
    <div class="block">five</div>
</div>

和css:

.outer {
    text-align:center;
    width: 50%;
    background-color:lightgray;
}

.block {
    width: 50px;
    height: 50px;
    border: 1px solid lime;
    display: inline-block;
    margin: .2rem;
    background-color: white;
}

Answer 5

以下解决方案为我工作.

  .algncenterdiv {
    display: block;
    margin-left: auto;
    margin-right: auto;
    }