如何居中div？

问题描述：

可能重复：
How to center DIV in DIV?如何居中div？

听起来简单，但无法弄清楚：

如何中心固定宽度的div在页面上？

默认情况下，它向左。

halign已弃用，但我可以找到替换品。

[更新]

width:800px;left-margin:auto;right-margin:auto:

的伟大工程。

有没有办法做到这一点，没有设置固定的宽度？

[这么多重复]（http://*.com/search?q=center+div）。 – Alex

答

试试这个：

<style> 
.centered { 
margin-left:auto; 
margin-right:auto; 
} 
</style> 

<div class="centered"> 
Some text 
</div>

答

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

答

<div style="margin:0 auto">content here</div>

答

margin:auto;应该做的伎俩，我猜？

答

只要你有一个适当的doctype声明，围绕一个网页div作为应尽可能简单：

#someDiv { 
    width: 624px; 
    margin-left: auto; 
    margin-right: auto; 
}

如果你使用IE浏览器，你没有一个DOCTYPE声明（你'以怪癖模式运行），这是行不通的。解决方法是将适当的doctype声明添加到您的页面。你可以在这里找到相应的声明：

什么是合适的文档类型？ – evan

@evan - 这一切都取决于您创建的文档类型。 –

答

一个DIV，默认情况下，是整个页面的宽度。

.mydiv 
{ 
    text-align: center; 
}

您可以通过执行该中心在div本身：您可以通过div的CSS设置为居中内容

.mydiv 
{ 
    display: inline-block; /* make it be only as wide as its contents */ 
    margin: auto; /* centering magic by making the margins equal and maximum */ 
}

答

有普遍做的两种方式（我见过）。一个与容限属性，另一个定位和left:50%

http://jsfiddle.net/NvaEE/

<br> 
<div class="first"> I have a fixe dwidth</div> 
<br> 
<div class="second"> I have a fixe dwidth</div> 

div{width:200px; background:#ddd;} 

div.first{margin:0 auto;} 
div.second{position:absolute;left:50%;margin-left:-100px}

答

可以居中不跨越整个页面的任何股利。说你的div是

.div { 
width: 80%; 
margin: 0 auto; 
}

然后它会正常工作。正如埃文所说的“显示：内联块;”将使div与其内容一样宽，这也将以“margin：0 auto”起作用。

答

你敷在跨越页面宽度的div容器，并给该容器div的，

text-align: center;

的CSS属性。

还有其他方法，例如管理边距和宽度。对于大多数情况下，你可以通过文本对齐来获得。

相关推荐