浮點數和高度

我有一個名爲footerWrap的div，其中包含3個無序列表。我向左漂浮，所有無序列表。浮點數和高度

我的意圖是根據無序列表的高度使footerWrap高度增長。然而...在所有的瀏覽器（免除IE6）無序列表通過分區...就像他們有Z索引屬性！

我試圖把一個div末，用明確的：一切，我也試圖使浮動：在DIV＃footerWrap

無這是我的文檔類型：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

這是我的全部CSS代碼：

div#footerWrap 
{ 
    height:180px; 
    background-color:#5c5c5c; 
    background-image:url('../../img/bgFooter.png'); 
    background-repeat:repeat-x; 
    background-position:top; 
    padding-top:20px; 
    padding-left:15px; 
    margin-top:20px; 
} 



    /* menus footer */ 
    div#footerWrap ul#mainMenu, 
    div#footerWrap ul#myMenu, 
    div#footerWrap ul#othersMenu 
    {width:180px; float:left;} 

     div#footerWrap ul#mainMenu li a, 
     div#footerWrap ul#myMenu li a, 
     div#footerWrap ul#othersMenu li a 
     { 
      color:#dadada; 
      text-decoration:none; 
      padding:5px; 
     } 

      div#footerWrap ul#mainMenu li a, 
      div#footerWrap ul#othersMenu li a 
      {padding:5px 10px;} 

      /* hover */ 
      div#footerWrap ul#mainMenu li a:hover, 
      div#footerWrap ul#othersMenu li a:hover 
      {color:#fff; background-color:#666;} 


    /* menu principal */ 
    div#footerWrap ul#mainMenu {margin-top:-10px;} 

     div#footerWrap ul#mainMenu li{line-height:24px;}  

     /* /menu principal */ 



     /* o meu menu*/ 
     div#footerWrap ul#myMenu {margin-left:15px;} 

      div#footerWrap ul#myMenu li {color:#fff; line-height:22px;} 

        div#footerWrap ul#myMenu li.myMenuItem a 
        { 
         background-image:url('../../img/smallArrow.gif'); 
         background-repeat:no-repeat; 
         background-position:left 7px; 
         padding-left:15px; 
         padding-right:20px; 
        } 

         div#footerWrap ul#myMenu li.myMenuItem a:hover 
         {color:#fff; background-color:#666;}     
     /* /o meu menu */ 



     /* outros menu */ 
     div#footerWrap ul#othersMenu {margin-left:300px; width:340px;} 

      div#footerWrap ul#othersMenu li 
      { 
       color:#fff; 
       line-height:22px; 
      } 

       div#footerWrap ul#othersMenu li a{margin-left:5px;} 
       div#footerWrap ul#othersMenu li a span {margin-left:-5px;} 

     /* /outros menu */

，這是我的XHTML代碼：

 <div id="footerWrap"> 

      <!-- menu principal --> 
      <ul id="mainMenu"> 
       <li><a href="#">item</a></li> 
      </ul> 


      <!-- o meu menu --> 
      <ul id="myMenu"> 
       <li>meu menu</li> 
       <li class="myMenuItem slideMenuItem"><a href="#">item</a></li> 
      </ul> 


      <!-- outros menu --> 
      <ul id="othersMenu"> 
       <li><span>outros</span></li> 
       <li><a href="#">item</a></li> 
      </ul> 

     </div>

來源

2009-10-19 M. Silva

你不需要height: 180px;上#footerWrap。漂浮3ul的左邊是好的，但你需要清除它們。

將.clear {clear:both;}添加到您的CSS。在關閉#footerWrap div之前添加<div class="clear"></div>。

您可能還會嘗試將position: relative;添加到#footerWrap並將div#footerWrap ul {display: block;}添加到您的CSS中。

來源

2009-10-19 17:15:08

你是對的！我添加了高度屬性只是爲了測試背景，在div有任何元素之前，我完全忘記了以後刪除它。 Thx很多爲您的幫助。 – 2009-10-19 17:22:10

-1

你爲什麼不嘗試保證金：

div#footerWrap ul#mainMenu {margin-left:0} 
div#footerWrap ul#myMenu {margin-left:200px} 
div#footerWrap ul#othersMenu {margin-left:200px}

其實180似乎是不夠的，但渲染還包括墊襯，所以你需要一個大於180

來源

2009-10-19 16:59:31 phunehehe

Thx爲答案。但是，利潤率如何能夠幫助集裝箱公司的高度增長？我不是很瞭解。問題不在於無序列表的定位，而是容器沒有增長，我向無序列表添加更多項目。 – 2009-10-19 17:07:31

浮點數和高度

回答

相關問題