如何集中其父母所拥有的内容：固定？

Question

JSBIN

我想将数字行居中，但其父级具有固定属性，我不想使用javascript来计算数字行位置。无论如何用纯CSS来实现吗？

我尝试如下：

1. 使用margin: 0 auto，但没有成功，也许原因是没有宽度。
2. 使用text-align: center，但没有成功，也许数字行不是内联元素。

非常感谢：）

Answer 1

从float:left移除li并添加display:inline-block，然后使用text-align:center上的ul。

#menu{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    border:1px solid #f00;
    z-index: 99;
    ul{
        width: 100%;
        margin: 0 auto;
      text-align:center;
        padding: 0;
        list-style-type: none;
        li{
            display:inline-block;
            a{
                display: inline-block;
                width:32px;
                height: 32px;
                text-align: center;
                font-family: "Microsoft YaHei";
                font-size: 1.5rem;
                line-height: 180%;
                text-decoration: none;
                border-radius: 50%;
            }
        }
    }
    .active{
        a{
            background-color: rgba(255,255,255,0.7);
        }
    }
}