固定元素内的中心元素

Jus*_*ald 5 html css

我无法将一个元素居中放置在另一个已修复的元素中:

bottombanner 在 html 正文中:

<div id="bottombanner">
<div>
    <ul>
        <li><a href="contact.html">ContactUs</a></li>
        <li><a href="about.html">AboutUs</a></li>
        <li><a href="help.html">Help</a></li>
        <li><a href="bugs.html">BugReportBox</a></li>
        <li><a href="suggestions.html">SuggestionBox</a></li>
    </ul>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)

css 已正确链接:

    #bottombanner{
    position:fixed;
    width:100%;
    bottom:0;
    }

    #bottombanner > div {
    position:absolute;
    width:100%;
    }

    #bottombanner > div > ul {
    position:relative;
    margin-left:auto;
    margin-right:auto;
    -webkit-margin-start: auto;
    -webkit-margin-end: auto;
    -webkit-padding-start: 0;
    }
Run Code Online (Sandbox Code Playgroud)

Kev*_*her 4

添加高度#bottombanner(至少,对于我的小提琴来说这是必要的)并添加text-align: center#bottombanner > div

#bottombanner{
    position:fixed;
    width:100%;
    bottom:0;
    height: 130px;
}

#bottombanner > div {
    position:absolute;
    width:100%;
    text-align:center;
}

#bottombanner > div > ul {
    position:relative;
    margin-left:auto;
    margin-right:auto;
    -webkit-margin-start: auto;
    -webkit-margin-end: auto;
    -webkit-padding-start: 0;
}
Run Code Online (Sandbox Code Playgroud)

小提琴: http: //jsfiddle.net/kboucher/cFgNx/