Go Back   CodingForums.com > :: Client side development > HTML & CSS

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 12-14-2002, 02:40 PM   PM User | #1
Kiwi
Regular Coder

 
Join Date: Oct 2002
Posts: 380
Thanks: 0
Thanked 0 Times in 0 Posts
Kiwi is an unknown quantity at this point
css and <select>

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:
Code:
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.

Thanks.
__________________
Strategy Conscious
Kiwi is offline   Reply With Quote
Old 12-14-2002, 02:50 PM   PM User | #2
krycek
Regular Coder

 
Join Date: Nov 2002
Location: Bristol, UK
Posts: 932
Thanks: 0
Thanked 0 Times in 0 Posts
krycek is an unknown quantity at this point
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 [::
__________________
ithium | SOAPI | SDP | PTPScript manual
"ithium is a non-profit webhost, which is pretty much unique. The mission of ithium is to provide free hosting resources for worthwhile and needy non-profit projects, which otherwise may not be able to obtain such facilities. The money from commercial customers goes to maintain ithium's servers and further development."
krycek is offline   Reply With Quote
Old 12-14-2002, 03:37 PM   PM User | #3
cheesebagpipe
Regular Coder

 
Join Date: Nov 2002
Posts: 596
Thanks: 0
Thanked 0 Times in 0 Posts
cheesebagpipe is an unknown quantity at this point
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.

http://www.outfront.net/tutorials_02...unkyforms1.htm
cheesebagpipe is offline   Reply With Quote
Old 12-14-2002, 04:58 PM   PM User | #4
jkd
Senior Coder

 
jkd's Avatar
 
Join Date: May 2002
Location: metro DC
Posts: 3,163
Thanks: 1
Thanked 18 Times in 18 Posts
jkd will become famous soon enough
Mozilla and related browsers (Netscape 6+, K-meleon, Phoenix, Chimera, etc) have no problem styling <select> elements.
__________________
jasonkarldavis.com
jkd is offline   Reply With Quote
Old 12-14-2002, 05:14 PM   PM User | #5
Kiwi
Regular Coder

 
Join Date: Oct 2002
Posts: 380
Thanks: 0
Thanked 0 Times in 0 Posts
Kiwi is an unknown quantity at this point
I test in moz, and the style I included didn't effect the select elements (except for the font).
__________________
Strategy Conscious
Kiwi is offline   Reply With Quote
Old 12-14-2002, 06:35 PM   PM User | #6
krycek
Regular Coder

 
Join Date: Nov 2002
Location: Bristol, UK
Posts: 932
Thanks: 0
Thanked 0 Times in 0 Posts
krycek is an unknown quantity at this point
same here, kiwi. I also find that you cannot style scrollbars in moz, which is a big pity

::] krycek [::
__________________
ithium | SOAPI | SDP | PTPScript manual
"ithium is a non-profit webhost, which is pretty much unique. The mission of ithium is to provide free hosting resources for worthwhile and needy non-profit projects, which otherwise may not be able to obtain such facilities. The money from commercial customers goes to maintain ithium's servers and further development."
krycek is offline   Reply With Quote
Old 12-14-2002, 06:42 PM   PM User | #7
jkd
Senior Coder

 
jkd's Avatar
 
Join Date: May 2002
Location: metro DC
Posts: 3,163
Thanks: 1
Thanked 18 Times in 18 Posts
jkd will become famous soon enough
Quote:
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.
__________________
jasonkarldavis.com
jkd is offline   Reply With Quote
Old 12-14-2002, 07:30 PM   PM User | #8
Kiwi
Regular Coder

 
Join Date: Oct 2002
Posts: 380
Thanks: 0
Thanked 0 Times in 0 Posts
Kiwi is an unknown quantity at this point
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.
__________________
Strategy Conscious
Kiwi is offline   Reply With Quote
Old 12-14-2002, 07:39 PM   PM User | #9
jkd
Senior Coder

 
jkd's Avatar
 
Join Date: May 2002
Location: metro DC
Posts: 3,163
Thanks: 1
Thanked 18 Times in 18 Posts
jkd will become famous soon enough
http://www.jasonkarldavis.com/select.html

Works for me.
__________________
jasonkarldavis.com
jkd is offline   Reply With Quote
Old 12-15-2002, 04:15 AM   PM User | #10
cg9com
Senior Coder

 
Join Date: Jul 2002
Posts: 1,628
Thanks: 0
Thanked 0 Times in 0 Posts
cg9com is an unknown quantity at this point
um, works for me to in ie6
margin and border dont effect IE for a select which is what to specify in the css.
__________________

Moderator: General web building

Get out from under them, resist and multiply.
Get out from under precipice and see the sky.
cg9com is offline   Reply With Quote
Old 12-15-2002, 04:59 AM   PM User | #11
chrismiceli
Regular Coder

 
Join Date: Sep 2002
Location: Louisiana
Posts: 576
Thanks: 0
Thanked 0 Times in 0 Posts
chrismiceli is an unknown quantity at this point
i use mozilla jkd, i understand what you are saying, but can mozilla style textarea scrollbars? they are not part of the program.
chrismiceli is offline   Reply With Quote
Old 12-15-2002, 08:01 AM   PM User | #12
cg9com
Senior Coder

 
Join Date: Jul 2002
Posts: 1,628
Thanks: 0
Thanked 0 Times in 0 Posts
cg9com is an unknown quantity at this point
technically it is part of the program, any scrollbar
__________________

Moderator: General web building

Get out from under them, resist and multiply.
Get out from under precipice and see the sky.
cg9com is offline   Reply With Quote
Old 12-15-2002, 10:42 AM   PM User | #13
Kiwi
Regular Coder

 
Join Date: Oct 2002
Posts: 380
Thanks: 0
Thanked 0 Times in 0 Posts
Kiwi is an unknown quantity at this point
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.
__________________
Strategy Conscious
Kiwi is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 07:37 AM.


Advertisement
Log in to turn off these ads.