Question

我以前习惯使用<center>，但现在它已经被删除了我使用推荐的margin属性的时间很长。谁能给我一些关于如何使用＆＃34;更好＆＃34;如何与中心对齐？

HTML

<div id="main_container">
    <div id="content_container">
        <div id="form_contact">
                <form method="post" action="index.php" style="display:inline">
                    <input type="email" name="email" id="email" style="display:inline">
                    <input type="text" name="subject" id="subject" style="display:inline"><br>
                    <textarea rows="10" cols="30" style="display:inline"></textarea><br>
                    <input type="submit" name="submit" id="submit" value="Send Message" class="submit" style="display:inline">
                </form
            </div>
        </div>
   </div>

CSS：

#header_container {
    width:100%;
    height:100%;
    position:relative;
    bottom:95px;
}

#main_container {
    width:100%;
    height:100%;
    margin-left:auto;
    margin-right:auto;
}

#content_container {
    width:100%;
    margin:0;
}

Answer 1

<html>
    <head>
        <style type="text/css">
            div.wrapper {
                width: 1000px;
                margin: 0 auto;
            }
        </style>
    </head>
<body>
    <div class="wrapper">
        <form>
            some inputs
        </form>
    </div>
</body>

Answer 2

好的，这是一个快速解决你的问题（我认为）。您需要做的就是为您的CSS添加几行代码。

html, body { margin: 0; 
padding: 0; 
}

body { 
text-align: center; 
}



#header_container {
width:100%;
height:100%;
position:relative;
bottom:95px;
}

#main_container {
width:100%;
height:100%;
margin-left:auto;
margin-right:auto;
}

#content_container {
width:100%;
margin:0;
}

这是一个包含工作代码的jsfiddle：http://jsfiddle.net/gmZ6v/

Answer 3

您只需添加以下CSS即可。

 #form_contact {
            display: block;
            margin-left:auto;
            margin-right:auto;
            text-align:center;
        }

无法获得对齐到中心工作的新方法

3 个答案: