让ul li水平居中（任意删除li也能水平居中）

HTML代码：

<div class="box">
        <ul class="button-ct">
            <li></li>
             <li></li>
             <li></li>
             <li></li>
        </ul>
</div>    

CSS代码：

.box{
    position:absolute;
    bottom:;
    left:;
    right:;
    text-align:center;
    width:300px;
    height:200px;
}
.button-ct{
    display:inline-block;
}
.button-ct>li{
    display：inline-block;
    width:20px;
    height:20px;
    background:red;
    margin: 5px;
}