我提到了 CSS align那指的是建议使用自动边距进行居中对齐。我用过它，但它没有对准中心。我检查并确认指定了文档类型。
这里遗漏了什么？
注意:我使用的是相对定位。
代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<style type="text/css">
.headerAlert
{
float:left;
width: 100%;
/*border: 1px solid blue;*/
display: inline;
}
.logoContainer
{
float:left;
width: 50px;
/*height:250px;*/
display: inline;
}
.vrContainer
{
float:right;
/*border: 2px solid yellow;*/
display: inline;
}
.underlineHeader
{
clear:both;
display: block;
height:10px;
width:100%;
float:left;
background-color:#632C5A;
}
.alert
{
padding:50px 0 0 0px;
/*border:1px solid red;*/
clear:both;
display: block;
}
.messageContainer
{
width:400px;
border: 1px solid red;
float: left;
display: block;
margin: auto;
align: center;
}
.message
{
padding:10px 0 0 0px;
clear:both;
display: block;
font-weight:bold;
font-size:20px;
color:#632C5A;
}
.options
{
padding:20px 0 0 0px;
font-size:14px;
}
</style>
</head>
<body>
<form name="_ctl0" method="post" action="RedirectAlert.aspx" id="_ctl0">
<input type="hidden" name="__VIEWSTATE" value="dDw5NjYas=" />
<div id="header" class="headerAlert">
<div id="mainLogo" class="logoContainer">
<IMG alt="My Inc" src="images/logo.png">
</div>
<div id="vcontainer" class="vrContainer">
<IMG alt="VIT" src="images/logo_v.jpg">
</div>
<div id="underline" class="underlineHeader">
</div>
</div>
<div class="alert">
<div class="messageContainer">
<div class="message">
AVC Lts
</div>
<div class="options">
If you still want to use
<input type="submit" name="btnContinue" value="Continue" id="btnContinue" />
</div>
</div>
</div>
</form>
</body>
</html>
最佳答案
问题是
.messageContainer {
float: left;
align: center;
}
只需删除这些行:float: left 会阻止 margin: auto 居中，并且 align: center 无效。
关于html - 即使在指定文档类型后中心对齐也不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/22593715/