爲什麼我的列表不在我的第二個div中？

Question

這是我的HTML：

<div class="topmenucontainer"> 
    <div id="topmenu"> 
    <ul> 
    <li style="border-right: 1px solid black;"><a href="">Login</a></li> 
    <li><a href="">Partner Countries</a></li> 
    </ul> 
    </div> 

這是我的CSS：

.topmenucontainer { 
    margin:0 auto; 
    border:1px solid red; 
    background-color:#000; 
    display:block; 
} 

#topmenu { 
    margin:0 auto; 
    border:1px solid red; 
    /*min-height:25px;*/ 
    background-color:#fff; 
    width:900px; 
    display:inline; 
} 

#topmenu ul { 
    margin:0px; padding:0px; 
    list-style-type: none; 
    float:right; 
} 

#topmenu ul li { 
    float:left; 
} 

，這是它是如何顯示

http://img842.imageshack.us/img842/8627/3ktn.jpg

爲什麼不顯示UL哪裏我把它放在了？我的意思是爲什麼它不顯示在我的topmenu div裏面，它是白色的背景，只有900px寬？

Answer 1

您需要添加一個明確的：既div來處理內浮

<div class="topmenucontainer"> 
    <div id="topmenu"> 
     <ul> 
     <li style="border-right: 1px solid black;"><a href="">Login</a></li> 
     <li><a href="">Partner Countries</a></li> 
     </ul> 
     <div style="clear:both;"></div> 
    </div> 
</div> 

Answer 2

我覺得你並不需要在你的.topmenucontainer*任何樣式。你可以擺脫.topmenucontainer款式

你可以在topmenu上試試以下款式。你有最後的想法你想要達到什麼？

#topmenu { 
    overflow: hidden; 
    margin: 0 auto; 
    border: 1px solid red; 
    background-color: #fff; 
    width: 900px; 
}