表格单元格显示不会使内容居中

Question

我有一个显示水平按钮窗格的有序列表（<ol>）。

为避免垂直显示按钮项目，我使用属性display: table-cell;。但是，现在所有项目都显示在左端。

jsfiddle是@ http://jsfiddle.net/42xt001j/

快照 -

我如何确保，每个菜单项占据ol宽度的三分之一？

添加额外的属性width:33%以垂直方式重新排列项目，这是不可取的。

Answer 1

您需要在容器display: table

上使用<ol>

Demo

li {
  display: table-cell;
  margin: 0 15px 0 0;
  border-right-style: dotted;
  color: blue;
  border-color: #000000;
}
ol {
  float: left;
  width: 27em;
  border: 4px solid black;
  margin: 5em auto;
  list-style: none;
  padding: 10px 0;
  text-align: center;
  display: table;
}
li:last-child {
  border-right-width: 0;
}

<ol>
  <li>Save suite</li>
  <li>Load suite</li>
  <li>Run suite</li>
</ol>

Answer 2

你需要改变我提到的css。

QListView