html - div 内のハイパーリンクを中央に配置する

Question

私はこのcssを持っています：

#footerLinks {
    text-align: center;
    margin: auto;   
}

#footerLinks a {
    float: left;
    color: #c2c2c2;
    display: block;
    font-size: 12px;
    margin-right: 10px;
}

そして、このhtml：

<div id="footerLinks">
    <a href="">No Porn on App Store</a>
    <a href="">Porn and Apple</a>
    <a href="">iPhone Porn Wiki</a>
</div>

問題は、ハイパーリンクがページの中央に表示されないことです。私は試しmargin: autoてtext-alignみましたが、何も機能しないで遊んでみましたmargins。なぜですか?

Answer 1

削除float:left;しdisplay:block;てこのクラスから

#footerLinks a {                
    color:#c2c2c2;
    font-size: 12px;
    margin-right: 10px;
}

デモ

Answer 2

CSS を更新します。

#footerLinks {
    text-align: center;
    margin: auto;   
}

#footerLinks a {
    color: #c2c2c2;
    font-size: 12px;
    margin-right: 10px;
}