Zachowaj odstępy w html wybierz opcje elementów za pomocą "white-space: pre" NOT working

Question

Mój problem pochodzi z rozwijanego menu HTML, nie można zachować wielu kolejnych białych znaków w opcjach. Oto przykładowa testcase i wynik. Css "white-space: pre" wydaje się działać tylko dla dowolnego elementu html z wyjątkiem opcji select element. Czy istnieje literatura lub przypadki identyfikujące taki problem? Wszelkie sugestie/doradzić pomocny

print "<style>.keepwhitespace { white-space: pre }</style> 
<p class='keepwhitespace'>abc def</p> 
abc def 
<br/> 
<br/>select and options with keepwhitespace 
<select onchange=\"alert('\''+this.value+'\' '+this.value.length)\" class='keepwhitespace'> 
<option class='keepwhitespace'>Any </option> 
<option class='keepwhitespace'>abc def </option> 
<option class='keepwhitespace'> Any </option> 
<option class='keepwhitespace'>abc def </option> 
</select> 
<br/>select with keepwhitespace 
<select onchange=\"alert('\''+this.value+'\' '+this.value.length)\" class='keepwhitespace'> 
<option >Any </option> 
<option >abc def </option> 
<option> Any </option> 
<option>abc def </option> 
</select> 
<br/>options with keepwhitespace 
<select onchange=\"alert('\''+this.value+'\' '+this.value.length)\"> 
<option class='keepwhitespace'>Any </option> 
<option class='keepwhitespace'>abc def </option> 
<option class='keepwhitespace'> Any </option> 
<option class='keepwhitespace'>abc def </option> 
</select>"; 

wynik wygląda tak:

preinstalowanym Jak widać w „p” elementów znacznika (oraz wszelkie inne, które starałem użyciu, działa dobrze formatowanie tekstu z " spacje”style css. Jednak wybór nie.

na wybór, aby zobaczyć ciąg wartości pozycja i długość łańcucha (długość powinien mieć już 10 zamiast 7,«abc def»to 8 znaków w długość)

Każda pomoc doceniona. ;)

LUHFLUH

Answer 1

wejścia Formularz zwykle mapować do ich odpowiednich rodzimych kontroli OS więc mogą być trudne do stylu. Typowe obejście problemu polegające na tym, że białe spacje nie zapadają się na 1 spację w <option> s, to użycie   zamiast zwykłych spacji.

np. jedna z opcji byłoby:

<option>&nbsp;Any&nbsp;&nbsp;</option> 

Więcej niestandardowym wyglądzie, byś ukryć prawdziwy wybierz element, całkowicie i zastąpić go niestandardowym znaczników i JavaScript.