html - 将内部 div 居中对齐

Question

我有 2 个 div，内部 div 和外部 div。如何将内部div居中对齐？
这是我的源代码:

<div class="menu">
    <a href="AdminHomePage.php?id=logout">Manage Staff</a>
</div>

这是 CSS:

.menu{
    margin: 100px auto;
    z-index: 2;
    opacity: 0.9;
    text-shadow: 2px 2px 5px #000000;
    width:300px;
    border-style: solid;
    border-width: 1px;
}

.menu a{
    color: #fff;
    font-size: 35px;
    border-style: solid;
    border-width: 1px;
}

外层居中，内层左对齐。如何居中对齐？

Answer 1

添加文本对齐:居中；到你的父 div css

.menu{
    margin: 100px auto;
    z-index: 2;
    opacity: 0.9;
    text-shadow: 2px 2px 5px #000000;
    width:300px;
    border-style: solid;
    border-width: 1px;
    text-align: center;
}

.menu a{
    color: #fff;
    font-size: 35px;
    border-style: solid;
    border-width: 1px;
}

<div class="menu">
    <a href="AdminHomePage.php?id=logout">Manage Staff</a>
</div>