Customizing Drop Down Menu

How can I customize a simple drop down menu? I would like to customize such things as background color, font size, etc.

To avoid confusion, I'm refering to the following drop/pull down menu:

<form method="POST">
    <select name="menu" size="1">
    <option value="http://www.domain.com">Option 1
    <option value="http://www.domain.com">Option 2
    <option value="http://www.domain.com">Option 3
    </select>
</form>

I've tried using:

style="color: #000000; font-size: 15px;"

However, it doesn't seem to work.

If at all possible, I would like to keep the customization elements within the form code, without using internal or external CSS (if this makes any sense).

Thanks!
spyderxAsked:
Who is Participating?
 
BatalfCommented:
You have to use CSS to format your form elements.

example:

<style type="text/css">
.formattedOption{
    color:#FF0000;
    background-color:#EEEEEE;
    font-weight:bold
}
option{
    color: #000066;
}
input{
    background-color: yellow;
}
</style>
<form method="POST">
    <select name="menu" size="1">
    <option class="formattedOption" value="http://www.domain.com">Option 1
    <option value="http://www.domain.com">Option 2
    <option value="http://www.domain.com">Option 3
    </select>
<input type="text">
</form>

Batalf
0
 
DreamMasterCommented:
Just a side note here...

You should close your option tags...

</option>

Regards,
Max.
0
 
spyderxAuthor Commented:
I see, so I would have to use CSS to format the form elements.

Is there a simpler, more compact way I can customize it?

Thanks.
0
 
DreamMasterCommented:
Using stylesheets is the most compact you will get spyderx...

Regards,
Max.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.