html - 如何在 HTML KickStart 中将宽度 col_4 的内容居中？

Question

我有一个表单，我希望它的宽度为 col_4，并使用来自 99lime.com 的 HTML KickStart 在中心。我怎么做？目前我有这个：

<div class="grid">
    <div class="col_12">
        <form class="vertical" action="#">
            <input size="5" id="text_email" type="email" name="email" placeholder="Email"><br>
            <input size=50 id="text_alias" type="text" name="alias" placeholder="Alias"><br>
            <input size=50 id="text_password" type="password" name="password" placeholder="Password"><br>
            <button type="submit">Sign up</button>
        </form>
    </div>
</div>

Answer 1

HTML Kickstart 似乎使用 CSS 浮动来构建网格。要使盒子居中，您需要跳出他们的网格系统。

也许向容器 div 添加一个自定义类，例如

<div class="grid">
    <div class="col_4 central">
        <form...

然后在你的 CSS 中，试试这个：

.grid .central {
    float: none;
    margin-left: auto;
    margin-right: auto;
}

将margin-left&设置margin-right为auto将 div 在其父级中居中（请参阅http://bluerobot.com/web/css/center1.html）。col_4它应该从类中选择一个宽度。