【问题标题】:How to center an inline <div>如何使内联 <div> 居中
【发布时间】:2014-04-11 08:47:50
【问题描述】:

我有一个 &lt;div&gt;display: inline; 属性,我想将它居中。

如果我设置 margin: 0 auto 不显示但我需要显示不要像块一样占用所有空间。

HTML

<div id="login1">
<fieldset id="login2">
    <form method="post" action="register.php">
        <label>Nombre: </label>
        <input type="text" name="nombre" placeholder="Nombre de usuario"><br>
        <label>Password:</label>
        <input type="password" name="password" placeholder="Password"><br>
        <input type="submit" value="LogIn">
        <input type="reset" value="Reset">
    </form>
</fieldset>
</div>

CSS

#login1 {
    display: inline-block;
    text-align: center;
}

我想将所有&lt;div&gt;居中

有什么想法吗?

【问题讨论】:

    标签: html css layout centering


    【解决方案1】:

    text-align: center 放在容器上(包含您的 div 的元素)。

    你的 div 应该居中。

    【讨论】:

    • 我必须把容器放在哪里?
    • 对于容器,他指的是 #login1 元素周围的任何东西。
    • @Ninjacu 容器是您的 div 所在的元素(在您发布的 HTML 中不可见,因此我无法真正向您展示)。它肯定包含在某种元素中。
    • @Ninjacu 不,您不必这样做。您查看您的 HTML。找到您的#login1 div。并检查它周围的元素。可以是body,也可以是不同的div,或者别的什么,我没看到。
    • @Ninjacu 然后将适当的容器(div 或其他任何符合语义的容器)添加到您的代码中。哦,我还想说,fieldset 应该在form 中,反之则不然。
    猜你喜欢
    • 2012-04-25
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-08-29
    • 2017-01-18
    • 2016-01-19
    • 2013-07-28
    相关资源
    最近更新 更多