Entry
Can I apply styles to a SELECT element?
Can I dynamically change the style of a SELECT element?
Feb 12th, 2002 22:34
Mark Szlazak, Martin Honnen,
IE4+ and NN6 allow to apply css to a SELECT element for instance try
<FORM NAME="formName">
<SELECT NAME="aSelect"
STYLE="color: white; background-color: orange;
font-size: 24pt;">
<OPTION>Kibology
<OPTION>JavaScript.FAQTs.com
</SELECT>
</FORM>
NN4 is not supporting that however though it allows some style change
using the FONT tag:
<FORM NAME="formName">
<FONT SIZE="+3" COLOR="orange">
<SELECT NAME="aSelect">
<OPTION>Kibology
<OPTION>JavaScript.FAQTs.com
</SELECT>
</FONT>
</FORM>
I think only on UNIX the color setting has effect.
IE4+ and NN6 also allow to dynamically change the css settings:
document.formName.selectName.style.fontSize = '36pt';
-------------
An alternative for NN4 is to wrap styled SPAN tags around the SELECT
element.
<HTML>
<HEAD>
<STYLE>
SPAN {
font-family: verdana, arial;
font-style: normal;
font-size: 8pt;
margin: 0px;
}
</STYLE>
</HEAD>
<BODY>
<FORM NAME="forums">
<SPAN>
<SELECT>
<OPTION VALUE="news">News
<OPTION VALUE="fishing trips">Fishing Trips
<OPTION VALUE="cooking recipes">Cooking Recipes
<OPTION VALUE="boats and engines">Boats and Engines
<OPTION VALUE="salmon fishing">Salmon Fishing
<OPTION VALUE="tuna fishing">Tuna Fishing
<OPTION VALUE="feedback">Feedback
<OPTION VALUE="all forums" SELECTED>All Forums
</SELECT>
</SPAN>
</FORM>
</BODY>
</HTML>
