按鈕排，如何使它佔用100％的空間？

HTML：

<div class="buttons"> 
    <div><input type="button"/></div> 
    <div><input type="button"/></div> 
    <div><input type="button"/></div> 
    <div><input type="button"/></div> 
</div>

CSS：

.buttons > div 
{ 
    float:left; 
    margin-left:25px; 
}

對於一些行，按鈕，只有3個按鍵將是可見的，有些人會只有2個按鈕可見。

如何使可見按鈕佔據按鈕行的整個空間，以便按鈕之間有足夠的空間（按鈕本身不應調整大小，除了空白邊距）？按鈕行的寬度是600px。

來源

2012-01-23 firebird

讓你的「行」的列表：

<div class="buttons"> 
    <ul> 
     <li><input type="button"/></li> 
     <li><input type="button"/></li> 
    <li><input type="button"/></li> 
    <li><input type="button"/></li> 
    </ul> 
</div>

來源

2012-01-23 18:42:32 jloper3

耶，子彈。我想你在這裏錯過了一些東西。 –

試過了，它不起作用。當只有3個按鈕可見時，它們之間仍然沒有足夠的空間。如果我使用空白左邊添加空間，當有4個按鈕可見時......它會包裝到下一行等。 – firebird

你試過width:100%;？

來源

2012-01-23 18:39:36 bschultz

這不起作用，因爲容器已經是100％（600px）。 – firebird

的唯一方法是使用特定類別爲每種類型的行，並計算出正確的邊距大小爲每個實例。即類調用buttons_4，buttons_3等與規則設定利潤率buttons_4 li和buttons_3 li等

要刪除您的保證金在第一個或最後一個項目，使用CSS選擇器buttons li:first-child或buttons li:last-child。

來源

2012-01-24 11:58:38 Chris

按鈕排，如何使它佔用100％的空間？

回答

相關問題