0

在将我的 CSS 菜单置于页面中间时，我已经尝试了所有方法。

您可以在 www.eyewitnesssurveillance.com 上查看 CSS 菜单

有人可以帮我把这个菜单放在页面中央吗？谢谢！

这是我正在使用的 CSS 代码：

.top-menu-wrap {
margin:     40px 0px 0 0px;
padding:    0;
z-index:    1;
position: relative;
margin: auto;


}

.top-menu-center {
position: center;
text-align: center;

}

.menu-toggle {
width:40px;
height:40px;
text-indent:-99999px;
cursor:pointer;
position:absolute;
opacity:1;
top:0px;
right:15px;
-webkit-transition: all 0.2s ease-in;
-moz-transition: all 0.2s ease-in;
transition: all 0.2s ease;

}

.menu-toggle:hover {
opacity:1;
-webkit-transition: all 0.2s ease-in;
-moz-transition: all 0.2s ease-in;
transition: all 0.2s ease;
}

.menu-toggle-off {
background: url(../../images/menu/menu_toggle.png) 0 top;}

.menu-toggle-on {
background: url(../../images/menu/menu_toggle.png) 0 bottom;}

.homemenu { 
font-family: 'Open Sans', sans-serif;
text-transform: uppercase;
padding:        0;
margin:         0;
height:         85px;
background: url(../../images/gradients/white_to_fade.png) repeat-y right top;
overflow:hidden;


}

.homemenu a { color:#666; text-decoration:none;}

.homemenu ul li {
background:#fff;
background: rgba(255,255,255,0.7);
overflow:hidden;
}
4

2 回答 2

1

你可以做几件事来集中注意力。如果您可以使用静态宽度，则可以执行以下操作： 

.homemenu { width: 960px; margin: 0 auto; }

您还可以在菜单周围有一个包装器 div，其样式如下：

.homemenu-wrapper { text-align: center; }

您可能想要研究的另一个选项是使用一些不错的脚手架/网格，就像在Twitter Bootstrap中找到的那样。我鼓励你看一下它或类似的东西，这对定位事情很有帮助。

于 2013-05-20T21:50:08.923 回答
0

如果您包含您的 html 或可以为它提供任何小提琴，那么它会更有帮助。除了你可以使用这种类型的外部 div 来定位它。

<div class="main-container">
<div class="container">
<!-- your menu code-->
</div>
</div>

/*css*/
.container{ width:1000px; margin:0 auto;}
于 2015-03-02T13:37:06.560 回答