cascading style sheet help

[Sita Atis]

Okay so my stylesheet named.. menustyle.css has the following:

.formfields
{
font-family: verdana, Arial, geneva, sans-serif; font-size: 7 pt;
color: #000000;
background-color: #ffffff;
margin-top: 2px;
vertical-align: middle;
border-color: #cccccc 000000 000000 #cccccc;
border-style: solid;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px
}

and my menu at www.geocities.com/sita.a refers to this for the drop down menu.. I don't even know if it's right but it doesn't work. I want it to be nice like the drop down menus at this site at the top: http://www.wyrdhaven.com/

[Dr Unne]

You could always borrow the source code from his site. It looks like he's using javascript or some other script that handles mouseOver events.

[Burtsplurt]

The dropdown menus might be done using DHTML. I had a look at the Javascript file, but that meant nothing to me, so it could do it.

[Flying Mullet]

all you have to do is specify that the drop down lists use the class defined in the style sheets. create your style sheet style as such:
select.formfields
{
...

then add the following attribute to your select:
class="formfields"

now as long as the drop down list supports the style sheet changes you specified, it should work.

[The Man]

just nitpicking here, but there're a couple of things i'd suggest you change beyond what other people have suggested for the sake of making everything work right for non-IE users :P

Originally posted by Sita Atis
.formfields
{
font-family: Verdana, Arial, Geneva, sans-serif; font-size: 7pt;
color: #000000;
background-color: #ffffff;
margin-top: 2px;
vertical-align: middle;
border-color: #cccccc #000000 #000000 #cccccc;
border-style: solid;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px
}

If no one else has adequately answered your question later on, I'll look into the site later; I'm a bit busy at the moment ;/

[Sita Atis]

Thanks that select thing worked!

Now how do I make the drop down button arrow things (see attachment image) match my scroll bar (ie, blue instead of that greyish default)? .. I don't know that much about these things.

Hey The Man, what changes?

[The Man]

As far as I know, it's not possible to change the appearance of the drop-down scrollbar, which is annoying, but since changing the scrollbars' appearance only works in Explorer anyway I don't really care enough to look into it more thoroughly.

As for the changes I made, I added # signs before the 000000s in your border-color listing and changed '7 pt' to '7pt'. Sounds nitpicky, but most browsers are equally nitpicky and nothing pisses me off more than web pages that only work right in Explorer. (Well, that's not really true, but we can safely disregard that for the time being ).

[Sita Atis]

heh I didn't notice the changes. I didn't write the code for the style sheet anyway, someone gave it to me and said I should have it in there.

You mean other browsers can't see the different bar colour? I didn't know that. I'm pretty sure you can do it for drop down menus.. I saw a few websites with it.. though I can't remember now since I don't have IE 6.0.. they wouldn't show up on anything less would they?

[The Man]

I dunno, it's been ages since I used a version of IE less than 6 and I stopped using IE at all about three weeks ago. But no, Explorer is the only browser I know of that changes the colours of the bars.

I'd recommend you test your style sheets in several browsers (Opera and Mozilla are probably the best choices) because different browsers handle CSS in insanely different ways. I'd *almost* say you don't even need to bother testing in Explorer, tho', 'cause if it works fine in Opera and Mozilla, it's a safe bet it'll work fine in Explorer.

[Dr Unne]

Some web form elements are OS-dependent and browser-dependent and dependent on what desktop theme you use. In Firebird in Linux right now they're all dark grey for me, and all form input boxes and text fields are black. OS dependent, I think.

[Flying Mullet]

There are OS and skin depenencies, but they are changable. I don't know how to change a drop down, but I have changed the color of input fields before, so I know that they are changable.

[The Man]

<textarea style="background-color: #143D6A; color: #EBFAFF; font-size: 13px; border-color: #88A5D7;">Yeah, these things are changable.</textarea>

Some of them don't stay the same in different browsers, though. Textarea is one of the ones that does, though (I think Opera ignores its colour components, at least).

[Sita Atis]

hmm okay, I'm only interested in changing those drop down box arrows. I guess it's no biggie, but it'd be interesting to know how.