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 回答