0

我有 HTML

<div class="mainwraper" style="width:100%;">
    <div class="header1">
        div logo left <img src="logo"> // - it sends it pasted to the left sidebar
        div class right // it send it pasted to the right sidebar 
    </div> // need to center them in the page and keep the repeative effect
    <div class="header2" style="width:100%;">
         <div class="headbar">
             <ul class="menu" style="background:#0099CC;"> … </ul>
         </div>
    </div>
</div>

CSS

.mainwraper {
    margin:0 auto;
}
.header1 {
    float:left; width:100%; height:78px; margin-top: 10px;
}
.header2 {
    float:left;
    width:100%;
    position:relative;
    z-index:auto;
    height:52px;
    margin-top:20px;
    background: #000;
    opacity: 0.65;
    border-radius: 10px;
}
.headbar {
    background-color: inherit;
    float: left;
    list-style-type: none;
    margin: 0 auto;
    padding: 0;
    position: relative;
    width: 100%;
    border-radius: 10px;
}
.menu {
    background-color: inherit;
    background-image:url(images/menugradient.png);
    float: left;
    list-style-type: none;
    margin: 0 auto;
    padding: 0;
    position: relative;
    width: 100%;
}

我希望它看起来像这样 [1]： http: //postimg.org/image/hi7knv1tp/ “工具提示”，但它看起来像这样 [2]： http: //postimg.org/image/ptqdhlfyv/ |tooltip “。我还想提一下，在我有另一个正确居中的 972px 的 Div 类主包装器之后。

4

1 回答 1

1

你可以用margin:0 auto;你的导航来居中

于 2013-10-09T13:44:15.407 回答