html - 如何居中多个 HTML UL 列表

Question

我对 HTML UL 列表有疑问。请参阅以下示例: http://uploads.demaweb.dk/li.html

我希望这两个菜单在线显示并居中。我该怎么做？

我无法使用菜单类更改 div 内的任何内容，因为它们是由 CMS 生成的。

Answer 1

你可以这样做......如果我正确阅读问题

添加text-align:center;到.container

和

display:inline-block; 到 .menu

  .container {
    width:800px;
    background-color:#e0e0e0;
    text-align:center;
  }

  .menu {
     margin:auto;
     display:inline-block;
  }

示例:http://jsfiddle.net/jasongennaro/8BAjV/

编辑

Your solution is almost working - except from situations where the lists does not have the same height.

在这种情况下，添加 vertical-align:top;

.menu {
    margin:auto;
    display:inline-block;
    vertical-align:top;
}

修改示例 http://jsfiddle.net/jasongennaro/8BAjV/2/