浮点数和高度

我有一个名为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

浮点数和高度

回答

相关问题