0

このリストを含む div で適切に中央に配置できません。左側に余白が残っており、いくつか試してみましたが、変更できないようです。私はcssに慣れていないので、まだ学習中です。事前に助けてくれてありがとう

より良い例として、jsfiddle を次に示します: http://jsfiddle.net/aSmfy/

html

<div id="navContainer">
                        <ul>

                              <li><a href="add_contact.php">Add Contact</a></li>
                              <li><a href="list-contacts.php">List Contact</a></li>    

                        </ul>
                </div>

CSS

#navContainer {
    width: 192px;}

#navContainer ul{
    width: 192px;
    }

#navContainer li{
    list-style-type:none;
    border-top:thin solid white;
    border-bottom:thin solid white;}
4

3 に答える 3

2

ul要素に 0 のパディングを置きます。

#navContainer ul{
    width: 190px;
    padding: 0;
}

http://jsfiddle.net/aSmfy/1/

于 2013-06-16T11:00:16.687 に答える
1

追加:

margin:0;
padding:0;

#navContainer ul へ

と :

 text-align:center;

#navContainer リへ

そしてそれは中央にあるはずです

于 2013-06-16T10:59:41.797 に答える
0

解決策 1 :

#navContainer {
width: 192px;
left: -20%;
position: relative;
}

この jSfiddleをチェックしてください

解決策 2:

#navContainer li{
        list-style-type:none;
    border-top:thin solid white;
    border-bottom:thin solid white;
        margin:0;
        padding:0;
        text-align:center;
}   

このフィドルをチェックしてください

于 2013-06-16T11:14:50.107 に答える