PDA

View Full Version : cascading style sheet help



Sita Atis
08-17-2003, 09:13 AM
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
08-17-2003, 03:44 PM
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
08-18-2003, 08:51 AM
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
08-18-2003, 02:43 PM
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
08-18-2003, 10:36 PM
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
08-19-2003, 11:28 AM
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
08-20-2003, 01:56 AM
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
08-20-2003, 03:03 AM
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
08-20-2003, 09:46 PM
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
08-20-2003, 10:19 PM
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
08-20-2003, 10:31 PM
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
08-20-2003, 11:02 PM
<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
08-21-2003, 02:21 AM
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.