1 reply [Last post]
trakwebster
Offline
newbie
Mount Shasta, CA
Last seen: 16 years 41 weeks ago
Mount Shasta, CA
Joined: 2004-01-16
Posts: 1
Points: 0

Hi, folks,

I'm working on a project, using an existing stylesheet, and I've made a form. On this form, where I have "<input ...>" items (ie: text boxes), the boxes are nicely colored along with the rest of the page.

But wherever I use a "<select ...>" item (ie: a drop-down box), the drop-down box field and the down-arrow are standard gray, and not colored nicely at all.

The stylesheet appears to have style definitions both for "input" and for "select". Here's what it contains ...

Quote:

input {
font: 100% Verdana, Helvetica, Arial, sans-serif;
border: 1px solid #900000;
color: Black;
background-color: white;
vertical-align: middle;
margin-bottom: 1px; /* IE bug fix */
padding: 0.1em;
}

select {
font: 100% Verdana, Helvetica, Arial, sans-serif;
border: 1px solid #900000;
vertical-align: top;
}

Using my handy-dandy TopStyle Pro program, I've tried tweaking everything I could think of in the "select" definition, and adding border this and border that. However, nothing I add seems to make any difference in the appearance of the drop down boxes.

Anybody here know how to get the border and the arrow of a drop-down box to be a certain color, and not the standard gray? I'd also like to get rid of the "shadow" effect on the top and left edges.

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 2 days 21 hours ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5343
Points: 2964

How to CSS-color a &quot;Drop-Down&quot; box?

Hi trakwebster,
Unfortunately how the select arrows is displayed is controlled by the browser.
I don't know of anyway to change it.