SELECT object issue

[jPaul]

Hi Everybody,

I'm using several SELECT objects in a form. There are two classes involved, select and select:focus.

The issue is that (when in focus) the SELECT objects will ignore the selector declarations for Border Color, Border Radius, Border Style, Border Width.

What have I missed, or is this behaviour not manageable?

[Pablo]

If you need help then please provide a DEMO project, otherwise it will be impossible to guess what you have done.

[jPaul]

Hi Pablo,

I've attached a demo project:
https://www.dropbox.com/scl/fi/xjypxsp0 ... s605&raw=1
You can see that the drop-down list provided by the SELECT statement ignores the declarations for Border Color, Border Radius, Border Style, Border Width and Box Shadow.
There is a style associated with Select:focus, but that doesn't seem to extend to the drop-down list provided.

Since I have several SELECT options planned, I would hope to manage this detail from the Style Manager. I want to avoid having to sprinkle javascript all over the place.

[Pablo]

As far as I know, it is not possible to style the dropdown menu via CSS.
Note that this is not specific to WWB.

It can only be done if you reproduce the select element yourself with JavaScript.
For example, like it is done in the 'dropdown list' object.

[BaconFries]

You can do it like the following but it may not be cross browser compatible see the url or alternativly you can use the Listview object in 'drop list' mode.

Code: Select all

<style>
select option 
{
background: red;
}
</style>

Code: Select all

<style>
select{
  background-color: green;
}
option{
  color: yellow;
}
</style>

See Styling with CSS
https://developer.mozilla.org/en-US/doc ... g_with_css
bootstrap-select
https://developer.snapappointments.com/ ... /examples/