View Full Version : css and <select>

12-14-2002, 03:40 PM
I'm trying to format select lists with css. I can't seem to get the colors to change. Is this possible? My current css is:
textarea, option, select, input { margin: 0px; border: 0px; background: #e0e6ff; color: #330033;}
It works as expected on the other form elements, but it doesn't for the select boxes.


12-14-2002, 03:50 PM
well, there are two parts to the answer.

First, you need to specify backgrounf-color in your css, not background. background is for specifying more than one property at once, background-color will let you do what you want.

Second, most browsers do not actually let you change the border properties of a select box, much like radio buttons and check boxes.

::] krycek [::

12-14-2002, 04:37 PM
Using the composite background property is perfectly OK; all newer CSS-capable browsers 'know' which property you want styled by the type of value you specify (same applies to font:, border:, etc). The rules you posted should work - although it doesn't make much sense using both select & option together; typically, option styles are applied in HTML, or using classes applied to individual options. Your text color is so close to the default (black), probably won't notice it. Forget about select borders - and some other attributes - these are system widgets and the, hem, 'options' are limited.


12-14-2002, 05:58 PM
Mozilla and related browsers (Netscape 6+, K-meleon, Phoenix, Chimera, etc) have no problem styling <select> elements.

12-14-2002, 06:14 PM
I test in moz, and the style I included didn't effect the select elements (except for the font).

12-14-2002, 07:35 PM
same here, kiwi. I also find that you cannot style scrollbars in moz, which is a big pity :(

::] krycek [::

12-14-2002, 07:42 PM
Originally posted by krycek
same here, kiwi. I also find that you cannot style scrollbars in moz, which is a big pity :(

::] krycek [::

Scrollbars are part of the program, not the webpage. Pages should not be able to affect anything other than itself. Therefore, scrollbar coloring is typically a bad idea, in terms of UI.

One could argue form widgets are also part of the program, but web pages can control them, so it is debatable whether or not you should be able to style them. But Mozilla allows the most extensive styling of form elements of any browser, since it implements it own instead of the OS's.

12-14-2002, 08:30 PM
I'm not so worried about the scrollbars (I never am, I hate styling them) -- it was the borders and colours that I wanted to change. It's not a critical problem, but it would be nice, if I could.

I used select and option together, because I wasn't sure which was the correct selector.

12-14-2002, 08:39 PM

Works for me.

12-15-2002, 05:15 AM
um, works for me to in ie6
margin and border dont effect IE for a select which is what to specify in the css.

12-15-2002, 05:59 AM
i use mozilla jkd, i understand what you are saying, but can mozilla style textarea scrollbars? they are not part of the program.

12-15-2002, 09:01 AM
technically it is part of the program, any scrollbar

12-15-2002, 11:42 AM
The problem is the "border:0px" -- it seems that this isn't valid for select/option style. But you can set a border that's not zero.

Thanks for the help.