我正试着和"margin:auto"
一起做一个DIV。它在Chrome和FF上工作得很好,但以下代码不能将DIV与IE居中:
CSS
#container {
margin:auto;
width:950px;
height:50px;
background:#000;
}
HTML
<div id="container"></div>
我做错了什么?
谢谢,
乔尔
编辑(完整的HTML/CSS代码):
<html>
<head>
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/3.2.0/build/cssreset/reset-min.css">
<style>
#container {
margin: 0 auto;
width:950px;
height:50px;
background:#000;
}
</style>
</head>
<body>
<div id="container"></div>
</body>
</html>
发布于 2011-07-05 19:20:48
在文档顶部插入以下内容:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
或用于html5
<!DOCTYPE html>
发布于 2010-10-21 21:48:54
试试这个;
#container {
margin:0 auto;
width:950px;
height:50px;
background:#000;
}
发布于 2014-03-25 20:28:46
您需要引用'2astalavista‘中提到的doctype
否则
1.如果宽度已知,则使用定位和负边距居中
<html>
<head>
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/3.2.0/build/cssreset/reset-min.css">
<style>
#container {
position: relative;
left: 50%;
margin: 0 0 0 -475px; /* negative margin of half the width */
width:950px;
height:50px;
background:#000;
}
</style>
</head>
<body>
<div id="container"></div>
</body>
</html>
2.使用外部容器和文本对齐中心来居中元素:
<html>
<head>
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/3.2.0/build/cssreset/reset-min.css">
<style>
#outerContainer{
text-align: center;
}
#container {
margin: 0 auto;
width:950px;
height:50px;
background:#000;
}
</style>
</head>
<body>
<div id="outerContainer">
<div id="container"></div>
</div>
</body>
</html>
https://stackoverflow.com/questions/3988034
复制相似问题