-1

我有两个div。一个应该是我的菜单,第二个只是标题。当我尝试使<li>项目彼此相邻浮动时,它会从其位置下降并影响我的标题 div;它进入标题 div(它将自己放入我的标题头)。

HTML:

    <div class="menu">
    <ul>
    <li>Home</li>
    <li>Query</li>
    <li>Reports</li>
    </ul>
    </div>
    <center><h3 class="empbox">Attendnace & Absence</h3></center>

CSS:

 .empbox 
 {
  height:30px;
  background:-moz-linear-gradient(left, #FFFFFF 0%,#6C8483 50%,#FFFFFF 100%); 
  background:-webkit-linear-gradient(left, #FFFFFF 0%,#6C8483 50%,#FFFFFF 100%); 
  background:linear-gradient(left, #FFFFFF 0%,#6C8483 50%,#FFFFFF 100%);
  width:100%;
  display:block;
  color:White;
  margin-top:190px;
  padding-top:10px;
  }
 .menu
 {
  background:white; color:Black;
 }
 .menu ul
 {
  list-style:none;
  padding-right:20px;
 }
 .menu li 
  {
  float:left;
  }

我希望我的 li 超过标题。我想知道为什么<li>不是唯一受影响的元素。我指定<li>了元素而不是整个 div。

4

2 回答 2

0

无法评论,所以让我们这样做......我不知道你到底想要什么。你能描述得好一点吗?无论如何,您不需要浮动列表项。如果你浮动ul并给display: inline<li>那就足够了。无论如何,这是解决了一个问题。现在等待您的回复。

给你:http: //jsfiddle.net/33VyN/

于 2013-08-11T18:47:05.743 回答
0

<div>您可以用清除浮动的 a 包裹标题。标签也<center>被弃用。

<div style="text-align:center;clear:both;">
 <h3 class="empbox">Attendnace & Absence</h3>
</div>
于 2013-08-11T18:47:13.090 回答