css：纵横对齐，IE
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5883231/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
css: vertical and horizontal align, IE
提问by lolalola
this code work fine with FF and Chrome, but with IE not.
此代码适用于 FF 和 Chrome，但不适用于 IE。
How fix this code with IE (9,8,7)?
如何使用 IE (9,8,7) 修复此代码？
<html>
<head>
<style type='text/css'>
.center{
background-color: #336699;
width: 200px;
height: 200px;
display: table;
}
.sub{
display: table-cell ;
vertical-align: middle;
text-align: center;
}
</style>
</head>
<body>
<div class="center">
<span class="sub">
Some text text...<br />
An some more text...
</span>
</div>
</body>
回答by Atari
The reason it's not working in IE9/8 is because you are missing your DOCTYPE. It still won't work in IE7, but if you make your span display block and adjust your margins, you can get it to look the same. See my example:
它在 IE9/8 中不起作用的原因是因为您缺少 DOCTYPE。它仍然无法在 IE7 中工作，但是如果您使跨度显示块并调整边距，则可以使其看起来相同。看我的例子：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1 /DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type='text/css'>
.center{
background-color: #336699;
width: 200px;
height: 200px;
display: table;
}
.sub{
display: table-cell ;
vertical-align: middle;
text-align: center;
}
</style>
<!--[if IE 7]>
<style type='text/css'>
.sub {
display: block;
margin: 70px auto;
</style>
<![endif]-->
</head>
<body>
<div class="center">
<span class="sub">
Some text text...<br />
An some more text...
</span>
</div>
</body>
回答by salahuddin
vertical-align: middle to the div will not vertically center its contents. It will attempt to align the paragraph with the previous and following elements. Since the div is a block level element (and, so are the surrounding elements), vertical-align: middle will have no effect at all.
垂直对齐：div 的中间不会垂直居中其内容。它将尝试将段落与前后元素对齐。由于 div 是一个块级元素（而且，周围的元素也是如此），vertical-align: middle 根本没有效果。
you can use line height to center its content.
您可以使用行高将其内容居中。
回答by Nasser Hadjloo
use this
用这个
body { padding: 0; margin: 0px;}
.Center { margin: 0 auto;}
it is welcome everywhere
到处都受欢迎
