0

liドキュメントの要素を中央に配置するのに問題があります。

私はラッパーを配置しました（要素<div align="center">の周りにありliますが、運はほとんどありません。

li要素のブロック全体ではなく、各要素のヘッダーを中央に配置しているようliです。ブロック全体をPriority, Round 1 and Round 2中央に配置したい（つまり、divの真ん中に）。

これはこれまでの私のコードです：http：//jsfiddle.net/nTcBk/

HTML

<div>
<div align="center">
<ul class="round">
        <li class="current-round" style="cursor: default; ">
          <div>Priority</div>
          <span>Ending 01/11/2012</span></li>
        <li style="cursor: default; ">
          <div>Round 1</div>
          <span>Starting 01/12/2012</span></li>
        <li style="cursor: default; ">
          <div>Round 2</div>
          <span>Starting 01/01/2013</span></li>
</ul>
</div>
</div>

CSS

.round {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
}
.round li {
    color: #DDD;
    cursor: pointer;
    float: left;
    font-size: 18px;
    padding-right: 20px;
}
.round li span {
    font-size: 12px;
    display: block;
}
.round .current-round {
    color: #2a145d;
    cursor: auto;
}
​

前もって感謝します

4

2 に答える 2

2

お楽しみください-http ：//jsfiddle.net/nTcBk/1/ の代わりに：

.round {
    width:100%;
}

使用する：

.round {
    display:inline-block;
}
于 2012-11-04T20:56:51.860 に答える
1

align属性はテーブル用です（非推奨です）。align = "center"の代わりに、CSSクラスをdivに追加できます <div class="align-center">

次に、CSSスタイルシートで次のことを行います。

.align-center {text-align:center}

于 2012-11-04T20:57:09.050 に答える