-1

我正在使用标准 UL LI 方法的网站上使用 Html 导航菜单。但问题是，当我调整浏览器窗口的大小时，菜单会调整大小，并且可视区域之外的菜单项会向下移动。有没有人遇到过类似的问题？html

<div style="margin-top: 11px; display: block;" class="menubar">
<ul class="tabs">
            <li ><a  href="#">Menu1</a></li>
            <li><a  href="#">Menu2</a></li>
            <li><a  href="#">Menu3</a></li>
            <li><a  href="#">Menu4</a></li>
            <li><a  href="#">Menu5</a></li>
            <li><a  href="#">Menu6</a></li>

</ul>
</div>

CSS

 .menubar {
background: url("images/bg.png") repeat scroll left top #222222;
border-bottom: 1px solid #B2D7FC;
border-top: 1px solid #B2D7FC;
color: #FFFFFF;
float: left;
height: 35px;
margin: 10px 0 0;
padding: 0 2%;
width: 96%;
}
ul.tabs {
display: block;
list-style-type: none;
margin: 5px 0 0;
padding: 0;
}
ul.tabs li {
background: url("images/tab_right.png") no-repeat scroll right top transparent;
float: left;
padding: 0;
position: relative;
}
4

2 回答 2

2

min-width在您的容器上设置 a或<ul>.

<ul>
    <li></li>
    <li></li>
</ul>

CSS

ul{
    min-width:720px;
}

将 更改为720px您希望菜单的大小。这样，它将调整大小，直到达到该限制。

于 2012-09-04T07:29:45.063 回答
2

请定义它width，如果你没有像

div
 { width:size %/px/em;
   min-width:%/px/em;
   position:absolute;
  }
于 2012-09-04T07:31:41.563 回答