頁腳內部無序排列不起作用

Question

我希望無序列表相對於頁腳div居中，但由於某種原因我無法使它正常工作。 我的擔心是我的粘性腳可能與它有任何關系，但我真的不知道。 幫助表示贊賞。

編輯：這也將出現，我不能margin-top內的任何元素#footer 。

HTML：

<div id="footer">
<ul>
    <li>Item1</li>
    <li>Item2</li>
    <li>Item3</li>
    <li>Item4</li>
        <li>Item5</li>
        <li>Item6</li>
        <li>Item7</li>
        <li>Item8</li>
            <li>Item9</li>
            <li>Item10</li>
            <li>Item11</li>
            <li>Item12</li>
</ul>
</div>

CSS：

#footer {
    height: 200px;
    background: linear-gradient(#545454, #3B3B3B); /* IE9- needs fix */ 
    position: relative;
    margin-top: -200px;
    clear: both;
    bottom: 0;
}

    #footer ul {
        width: 450px;
        margin: 50px auto; /* This is the part that doesn't work.. */
        font-size: 13px;
        color: white;
        -webkit-column-count: 3; /* Chrome, Safari, Opera */
        -moz-column-count: 3; /* Firefox */
        column-count: 3; /* Standard */
        -webkit-column-gap: 0; /* Chrome, Safari, Opera */
        -moz-column-gap: 0; /* Firefox */
        column-gap: 0; /* Standard */
    }

        #footer li {
            width: 150px;
            display: inline-block;
            margin: 5px;
        }

Answer 1

這是利潤率下降的問題。

觀看此演示http://jsfiddle.net/WfGej/並使用

   border-top:1px solid transparent;

像這樣： http : //jsfiddle.net/WfGej/1/