css - 爲選擇設置最大寬度

Question

我有一個包含場地下拉列表和提交按鈕的表單。 他們應該在同一條線上，但由於場地列表是動態的，因此它可能會變得太長，並且按下按鈕。

我正在考慮爲select設置一個max-width屬性，但我不清楚這是否適用於所有瀏覽器。您對解決方法有任何建議嗎？

<form action="http://localhost/ci-llmg/index.php/welcome/searchVenueForm" method="post"  class="searchform"> 
    <select name="venue"> 
     <option value="0" selected="selected">Select venue...</option> 
     <option value="1">venue 0</option> 
     <option value="2">club 1</option> 
     <option value="3">disco 2</option> 
     <option value="4">future test venue</option> 
    </select> 
    <input type="submit" name="" value="Show venue!" class="submitButton" /> 
</form> 

CSS：

.searchform select { 
max-width: 320px; 
} 

.searchform input.submitButton { 
float: right; 
} 

Answer 1

如果在服務器端生成的場地，你可以使用你的服務器端腳本要降價到一個特定的最大字符數。

當使用純CSS時，我也會嘗試在select和option元素上設置overflow:hidden。也可以嘗試在選項元素上設置max-width。當它在所有非IE中都可以使用時，您可以使用通常的腳本爲IE添加最大寬度支持。

Answer 2

嘗試：

fieldset select { 
    width: auto; 
}