收縮選擇，多箱的寬度

Question

一個在多選擇框中的項目比別人更長的時間，有沒有辦法破解它做它的寬度小

<select size="1"> 
<option>item</option> 
<option>item</option> 
<option>item is really long</option> 
<option>item</option> 
</select> 

Answer 1

你可以做這與CSS，無論是內聯風格還是使用類。

隨着內嵌樣式：

<select style="width: 50px;"> 
<option>item</option> 
<option>item</option> 
<option>item is really long</option> 
<option>item</option> 
</select> 

使用類：

<select class="narrow"> 
<option>item</option> 
<option>item</option> 
<option>item is really long</option> 
<option>item</option> 
</select> 

而在你的CSS文件或嵌入的樣式表：

.narrow { 
width: 50px; 
} 

當然，改變50像素到無論你需要什麼寬度。

Answer 2

您可以使用CSS設置寬度。如果你添加一個類選擇標籤，比如「富」，可以再加入CSS：

select.foo { 
    width: 200px; 
} 

如果你想可以使用內嵌樣式（不推薦雖然）：

<select style="width: 200px";> 
    <option>... 
</select> 

Answer 3

試試這個，在FireFox中可用，但在IE中不可用：

<STYLE type="text/css"> 
    OPTION.shorter{ font-size:8px;} 
</STYLE> 

<select size="1"> 
<option>item</option> 
<option>item</option> 
<option class="shorter">item is really long</option> 
<option>item</option> 
</select>