Question

我提到CSS align指的是使用自动边距进行居中对齐。我用它但它没有在中心对齐。我检查并确认指定了doctype。

这里遗漏的是什么？

注意：我正在使用相对定位。

CODE

<!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>

Answer 1

问题是

.messageContainer {
    float: left;
    align: center;
}

只需删除这些行：float: left阻止margin: auto居中，align: center无效。

Demo

Answer 2

＆＃34; .messageContainer＆＃34;有各种各样的问题。

你向左漂浮，这就是为什么它向左移动
＆＃39;对准：中心＆＃39;不是一件好事。使用＆＃39;保证金：0 auto＆＃34;代替
```
.messageContainer { margin: 0 auto; }
```

Answer 3

 `align: center;` in CSS doesn't exist.

是text-align: center;将文字置于

中对于margin:auto;和不：width，或位于float或{{1}的块元素，请

或absolute }} fixed

指定doctype后，中心对齐无效

3 个答案: