如何水平對齊以“阻止”div內的div？

Question

我有一個div，里面有另一個div，在那個div中有3個<a> 。 我希望內部div在外部div中水平對齊。

我怎樣才能實現這一目標？

外部div（Footer_Column）必須有display: inline_block和vertical-align: middle

所以它看起來像這樣：

-----------------------------
|                           |
|     i'm a link            |
|     i'm a long link       |                         
|     i'm short             |
|                           |
-----------------------------

HTML

<div class="Footer_Column">
    <div class="Footer_Column_Inner">
        <a href="url1.com">i'm a link</a>
        <a href="url2.com">i'm a long link</a>
        <a href="url3.com">i'm short</a>
    </div>
</div>

CSS

.Footer_Column {
        display: inline-block;
        vertical-align: middle;
        width: 32.7%;
    }
        .Footer_Column_Inner{
            display: inline-block;
        }
        .Footer_Column a {
            display: block;
            font: 13px Trebuchet MS;
            color: #464646;
            text-decoration: none;
        }

非常感謝！

Answer 1

.Footer_Column_Inner {
  margin: 0 auto;
  display: table;  
}

無需指定寬度

Answer 2

這是一個小提琴： http ： //jsfiddle.net/piedoom/Jk32y/

我將解釋CSS：

我添加了text align: center到父div以使項目居中，因為子div是一個內聯塊。

然后，為了證明子div中留下的文本，我添加了text-align: left;

我添加了一些背景顏色來向您展示它是如何工作的，但您當然會刪除顏色或將其設置為您需要的顏色。

希望這可以幫助。