2

我正在尝试使用 html、css、php 和 MySQL 创建一个站点。我正在尝试在标题中设计一个带有居中导航菜单的液体布局。在谷歌浏览器中，设计效果很好。但在 Firefox 和 IE 中，列表项的末尾会下拉到新行。我该如何解决这个问题？

我附上下面的代码片段：

菜单的 CSS 样式：

.menu {
    float:left;
    width:100%;
    background-image:url(../images/menu_bg.gif);
    background-repeat:repeat-x;
    min-width:750px;
    min-height:81px;
    overflow:hidden;
    position:relative;
    }

.menu ul{
    clear: both;
    float:left;
    list-style:none;
    text-align:center;
    left:50%;
    position:relative;
    display:inline-block;
    white-space: nowrap;
    }

.menu > ul > li { 
     float:left;
     right: 50%;
     position:relative;
     list-style:none;
}

.menu > ul > li > a {
    display:block;
    color:#ff3;
    text-decoration:none;
    background:transparent;
    padding:0 0 0 10px;
}

.menu > ul > li > a b {
    display:block;
    background:transparent;
    padding:0 10px 0 10px;
}

**********************************

css styles for Header:


#header {
    background-image:url(../images/header_bg.gif);
    background-repeat:repeat-x;
    height:160px;
    min-width:750px;
}

#logo {
    background-image:url(../images/logo.gif);
    background-position:10px 10px;
    background-repeat:no-repeat;
    height:79px;
}

*******************************************************

body: 

<div id="header">
  <div id="logo"></div>
  <div class="menu">
  <ul>
    <li class="current"><a href="../index.php"><b>Home</b></a></li>
    <li><a href="../about/about.php"><b>About Us</b></a></li>
    <li><a href="../services/services.php"><b>Services</b></a></li>
    <li><a href="../shop/shop.php"><b>Tech Shop</b></a></li>
    <li><a href="../downloads/downloads.php"><b>Downloads</b></a></li>
    <li><a href="../knowledge/knowledge.php"><b>Knowledge Base</b></a></li>
    <li><a href="../contact/contact.php"><b>Contact Us</b></a></li>
    <li><a href="../Livehelp/livehelp.php"><b>Live Help</b></a></li>
  </ul>   
  </div>
</div>
********************************
4

1 回答 1

-1

删除左边：50%；右：50%；它们毫无意义

于 2012-05-29T11:50:54.587 回答