Html 如何使动态div居中？

我不确定这个问题是否已经得到了回答（我想可能已经得到了），但您如何将这个动态div置于中心位置

（我希望

#two

与

#one

的中间位置对齐）

现在，我的JSFIDLE执行以下操作：

HTML:

<div id="one">
</div>
<div id="two">
        <a class="stuff">a</a>
        <a class="stuff">b</a>
        <a class="stuff">c</a>
</div>

#one { width:100%; height:200px; background-color:#222; float:left; }
#two { text-align:center; float:left; }
.stuff { width:20px; height:20px; background-color:#444; margin:0 5px; float:left; }

我试过

margin:0auto，
文本对齐：居中但仍然没有骰子。我不打算声明一个定义的
margin
like
margin:041%——它是如何用960px的宽度定义自己的

您需要将
#one
和
#two
包装在包含元素中。这应该设置宽度。然后，您需要做的就是删除所有的
浮点数（在
#one
、
#two
和
#two
的子项上）

#wrapper { width:500px; }
#two { text-align:center;}
.stuff { width:20px; height:20px; background-color:#444; margin:0 5px; }

新标记

<div id="wrapper">
    <div id="one"></div>
    <div id="two">
            <a class="stuff">a</a>
            <a class="stuff">b</a>
            <a class="stuff">c</a>
    </div>
</div>


A.
B
C

如果没有包装器，两个将只与
窗口的中心对齐（或与宽度相同的父窗口对齐）。
通过cimply将动态div居中，并给它一个
显示：table
值

演示

你想把
放在身体中央吗？元素的自动居中是由于放置了
float:left在它上面。@JeffNoel yeh这是真的，不过他还需要相对于
#one
而不是窗口居中。为了更清晰，我添加了一个编辑。也许你可以再看一次？哦，等等，这很有效！你能解释一下原因吗？我删除了
float
元素，它们只是快速就位…@RenoYeo只有当你的
#一个
元素是窗口大小的100%时，它才起作用，否则你需要将它包装在一个DIV中，正如我修改后的答案所说，
#one
元素是100%。还有一个问题——如果我想增加一个小的余量（10px0），我该怎么做？因为现在它取下整个物体并给它加上一个边距。。。如果你想给什么加上保证金？
#two {
    text-align:center;
    display: table;
    margin: 0 auto;
}