2010-03-08 101 views
5

這裏是我的了:有沒有辦法修復下拉列表的寬度?

<select id="box1"> 
    <option>ABCDEFG</option> 
</select> 

<select id="box2"> 
    <option>ABCDEFGHIJKLMNO</option> 
</select> 

我有2名不同的下拉列表。由於下拉列表的寬度取決於選項中最長文本的寬度,因此我最終得到2個具有2種不同寬度的下拉列表。這使我的網頁看起來很愚蠢。

我想要的是將其設置爲使我的兩個下拉列表具有相同的寬度(我寧願寬度很長,以至於最長的項目也不會被截斷)。

+1

請編輯並刪除單詞「length」。如果你的意思是寬度,比如寬度。如果您正在討論顯示的選項數量,請完整重新提出問題。 – rjmunro 2010-03-08 23:40:46

+0

固定。爲混淆Sr – 2010-03-08 23:44:50

+0

嘿沒有問題 - 這就是爲什麼堆棧溢出是部分維基,這樣一切都可以改善。 – 2010-03-09 12:54:26

回答

3

您可以使用CSS設置您的<select>元素的寬度,但很難讓寬度恰好與給定數量的字符匹配。

爲什麼要將選項的文本剪切?

+0

剛更新了我的帖子。 – 2010-03-08 23:35:00

+0

簡單有效。謝謝 – 2010-03-09 02:07:16

+0

啊,是的,解決方法是將它們都設置爲非常寬的寬度,有些瀏覽器甚至會很聰明,並允許展開狀態(即實際下降的位置)比您設置的寬度更寬,被剪裁,同時在不擴展時保持元素具有相同的寬度。 – 2010-03-09 12:53:31

5

長度引用可見選項的數量?如果是這種情況,請使用size。這裏是documentation。讓我知道你是否意味着任何不同。

編輯後: 設置選擇的寬度。但是很難將寬度設置爲只顯示特定的長度。 秒編輯: 你不能這樣做使用CSS,你必須使用JavaScript。在選擇的每一個變化,你必須看到兩個元素中的哪一個具有最大寬度並且設置爲與另一個相同。

+0

只是更新我的文章...抱歉模糊不清。這不是我想要使用的「大小」。我想截斷1個選項的長度,而不是下拉列表中的選項數量 – 2010-03-08 22:45:18

+0

只需再次更新我的文章。 – 2010-03-08 23:28:29

+0

我能不能把寬度設置得很長?這樣我就不用擔心哪個元素更長了 – 2010-03-09 01:57:39

-1

您需要在頁面加載後使用JavaScript(給你的列表id="listA"):

document.getElementById('listA').length = 20 

這將有效地在20個項目截斷它。

+0

您根本不需要*使用Javascript。另外,長度是SELECT中選項的數量...不是顯示選項的數量 – Dancrumb 2010-03-08 21:49:56

+0

只是更新我的代碼,對不起模糊:( – 2010-03-08 22:47:56

4

使用以下行。它將修復下拉列表的寬度。

<select id='box1' style='width: 200px;'> 

<select id='box2' style='width: 200px;'> 

如果您想使用css提及寬度,可以使用下面的代碼。

#container select { 
    width: 150px; 
} 
+0

是的,這是答案。非常感謝你,不過既然Paul D Waite首先回答,我就不得不讚揚他。 :) – 2010-03-09 19:28:12

相關問題