引導3：關閉圖標對齊

Question

關閉圖標表現怪異。
代碼

<div class="well sidebar-nav"> 

      <ul class="list-unstyled"> 
       <li>File Uploaded</li> 
       <li><a href="#">File 1</a> <button type="button" class="close" aria-hidden="true">&times;</button></li> 
       <li><a href="#">File 2</a> <button type="button" class="close" aria-hidden="true">&times;</button></li> 
       <li><a href="#">File 3</a> <button type="button" class="close" aria-hidden="true">&times;</button></li> 
      </ul> 
      </div> 

它的出現是這樣的：

Answer 1

的形象是21px高，但li只有20像素高（由於字體），所以彩車重疊。一個簡單而不引人注目的修復就是將li高度設置爲21px。也可以clear後li小號

http://jsfiddle.net/pxHZ9/1/

Answer 2

http://jsfiddle.net/pxHZ9/

您必須浮到左邊的兩個元素：

.list-unstyled li a, 
.list-unstyled li button { float:left; } 

------- -----------------------------------------或

可以後浮到左邊，第二個是第一個元素向右

.list-unstyled li a { float:left: } 
.list-unstyled li button { float:right; } 

必須清除浮動是這樣的：

.list-unstyled li { zoom:1; position:relative } 
.list-unstyled li:after { content:""; display:table; clear:both; }