CSS的白色空間：NOWRAP

Question

問題是vertical-align: top沒有奏效

CSS

ul { 
    width: 160px; 
    display: block; 
    white-space: nowrap; 
    overflow: auto; 
    vertical-align: top; 
    } 
li { 
    width: 80px; 
    display: inline-block; 
    } 

HTML

<div> 
    <ul> 
     <li>one</li><li>two</li><li>three</li><li>four<br />Test</li> 
    </ul> 
</div> 

我需要做一個，兩個，三個在像頂部四。請幫助

例這裏http://jsfiddle.net/Y7PhV/

謝謝

Answer 1

垂直對齊您的LIS，而不是UL

li {vertical-align:top;} 

http://jsfiddle.net/Y7PhV/88/

Answer 2

這個CSS應該工作...

ul {
width: 80px;
display: block;
/white-space: nowrap;/
/overflow: auto;/
}
li {
background: papayaWhip;
height: 40px;
width: 80px;
display: inline-block;
}