How to wrap the word of a select component?

[Randy Webb]

I hava a select component on my form. the width of the select
component is fixed,so if the length of the option's shown string
larger than the select component's width,how can i make the shown
string wrap to next line?

<select name=123 style="width:100px;height:200px">
<option value=1>abcdefghijklmnopqrstuvwxyz</option>
</select>

select component's width is 100px, the option's shown sring is
abcdefghijklmnopqrstuvwxyz,if shown string's length is larger
tthan 100px ,how can auto wrap it to next line?

And if you word wrap it, how will it display that selection?
px is a bad size definition also. If I have my font-size set to largest
and my neighbor has it set to smallest, then you get different results.
And, iiiiiiiiiiiiiiiii will not display as wide as XXXXXXXXXXXXXXXX nor
will xxxxxxxxxxxxxxxxx display as wide as XXXXXXXXXXXXXXXXXXX

XXXXXXXXXXXXXXXXXXX
iiiiiiiiiiiiiiiii
xxxxxxxxxxxxxxxxx

unless you specify a fixed width font.

One possible solution, that has many major flaws.

Display it as a multiple select list, specify the width in em's, specify
a fixed width font, with a fixed pitch, and then loop through the
elements and when you find one whose .text is wider, truncate it, create
a new option right below it, and append the text, keeping the same
value. And then hope/pray that your users don't have js disabled, dont
have CSS disabled, and that the browser supports what you are trying to
do, and then they dont get pissed at you for @#$%@#'ing with there display.

In short? Redesign your page to handle your options.

And for crying out loud, please get a newsreader that will wrap your lines.

 

[Michael Qiu]

I hava a select component on my form. the width of the select component is fixed,so if the length of the option's shown string larger than the select component's width,how can i make the shown string wrap to next line?

<select name=123 style="width:100px;height:200px">
<option value=1>abcdefghijklmnopqrstuvwxyz</option>
</select>

select component's width is 100px, the option's shown sring is abcdefghijklmnopqrstuvwxyz,if shown string's length is larger tthan 100px ,how can auto wrap it to next line?

I'm sorry,my english is very poor! many thanks!


Michael Qiu
(e-mail address removed)

 

[Michael Winter]

I hava a select component on my form. the width of the select
component is fixed,so if the length of the option's shown string larger
than the select component's width,how can i make the shown string wrap
to next line?

You can't, as far as I know. You'll either have to expand the control or
abbreviate the text.

Mike

 

[Michael Qiu]

thanks a lot!It's appreciated that you give me an immediate reply. I
will have a try according to your suggestion! thank you !