为什么div是居中而不是链接？

Question

在下面的HTML中，div#entertainment-logo已居中。这仅适用于现在，并且最初不起作用，当其中的链接被赋予相同的id但没有div时。为什么会这样？

---

HTML代码

<div id="entertainment-logo">
    <a href="/index.html" width="376px" height="82px">
        <img src="images/hdr-entertainment.gif" alt="CNN Entertainment">
    </a>
</div>

CSS代码

#entertainment-logo {
    margin: 0 auto;
    width: 376px;
}

Answer 1

<div>仅以margin: 0 auto;为中心，因为它是一个块元素。这种对齐并不影响儿童的任何对齐。

锚点是内联元素，因此由父级text-align属性对齐：

#entertainment-logo {
    margin: 0 auto;
    width: 376px;
    text-align:center;
}

JSFiddle