custom <select> width, inline, etc.

[i_dvlp]

I'm trying to replicate a fancy drop-down control (MS-egads!) with
form <select><option>

It doesn't look like you can specity width as an attribute or define
width with CSS.
It looks like my choices are to use smaller fonts or choose shorter
option strings.

inline: I want to put a small graphic immediately to the right of the
select.
Of course the select is hogging all the width, in the table cell, and
"nowrap" attr seems to be uneffective. ( I'm also using it in an
XSLT context and am forced to use nowrap="1" )
Are there other solutions ? can I specify nowrap or inline for div
or span or ??

Of course by def. the <select> shows the selected option and its width
specified by the longest value.

But I noticed, in some of these MS drop-down controls, the displayed
value is shorter length ( and is a representation ) of the selection
chosen from the list. ( where dropdown choices are very wide and extend
beyond the width of the control )
I've even seen dropdown selections, that had selections displayed in
columnar format.
ie: company | branch | address | dept

Anyone with suggestions ??? or has anyone implemented custom <select>
for web forms?

[i_dvlp]

Any feedback on this ?

[RobG]

i_****@hotmail.com wrote:

I'm trying to replicate a fancy drop-down control (MS-egads!) with
form <select><option>

It doesn't look like you can specity width as an attribute or define
width with CSS.
There is no HTML 'width' attribute for either select or option
elements. You can specify a width via CSS, but as always CSS is just a
suggestion to the browser - there is no obligation to obey your
suggestion (though most will most of the time).

Firefox will obey CSS width instructions for both select and options,
IE will for select elements.

It looks like my choices are to use smaller fonts or choose shorter
option strings.
Or CSS.

inline: I want to put a small graphic immediately to the right of the
select.
Of course the select is hogging all the width, in the table cell, and
"nowrap" attr seems to be uneffective. ( I'm also using it in an
XSLT context and am forced to use nowrap="1" )
'nowrap' is deprecated and shouldn't be used at all. Use the CSS
whitespace property:

<URL:http://www.w3.org/TR/CSS21/text.html#propdef-white-space>

Are there other solutions ? can I specify nowrap or inline for div
or span or ??
See whitespace above. I think inline is irrelevant here.

Of course by def. the <select> shows the selected option and its width
specified by the longest value.
Unless you sepecify some other width using CSS and the browser obeys
you.

But I noticed, in some of these MS drop-down controls, the displayed
value is shorter length ( and is a representation ) of the selection
chosen from the list. ( where dropdown choices are very wide and extend
beyond the width of the control )
I've even seen dropdown selections, that had selections displayed in
columnar format.
ie: company | branch | address | dept

URL? Example? It could be that they are using a mono-spaced font and
simple text formatting. The more complex it is, the more likely it is
to break on some browsers.

Maybe a select is not the right element to be using? What are you
actually trying to do?
--
Rob

[i_dvlp]

The dropdowns that I described were actually from MS Access, not on the
web.
They provided both type-in and dropdown choices, which is obviously
hard to replicate.

I like the drop-down displaying columnar data (which I can set up),
but it also forces the <select> to be the same length, unless I can
show a substring.
AFAIK, length of <option> and length of <select> have to be the same.

I've considered a textbox input and js code, that would (on keystrokes)
do a window.open of a detailed <select> that can then re-populate the
text box.
It would be complex, but may be the only way to simulate the MS
control.