HTML Forum

**TBLTK** · 07-02-2005, 10:27 PM

I put this code in the heads tags of a html page to change the scrollbar color but it didn't work.

<STYLE type="text/css">
BODY {
scrollbar-3dlight-color:#000000;
scrollbar-arrow-color:#000000;
scrollbar-base-color:#000000;
scrollbar-track-color:#000000;
scrollbar-darkshadow-color:#000000;
scrollbar-face-color:#D3D3D3;
scrollbar-highlight-color:;
scrollbar-shadow-color:#000000;

</STYLE>

Did I do it right?
Thanx,
Waz

**WaHoOoO!** · 07-02-2005, 10:35 PM

You didn't end the BODY section. After your final scrollbar tag, put a closing bracket "}".

**TBLTK** · 07-02-2005, 11:37 PM

That didn't work

**onlyplace4** · 07-03-2005, 06:22 AM

I think you'll find that this is another one of those great cross-browser incompatability issues. The style you have works fine in IE but not in Firefox.

**chrishirst** · 07-03-2005, 08:59 AM

scrollbar colours don't work in any other browser than IE.

**TBLTK** · 07-03-2005, 09:42 AM

it doesnt work in ie.

**onlyplace4** · 07-03-2005, 10:22 AM

No, it does work in IE, tested it myself ... but it won't work in any other browser OTHER than IE.

**TBLTK** · 07-03-2005, 11:16 AM

well it does work for things inside the page eg. a text area but I want it for the whole page.
I have attatched a picture of whats happening.
Thanx 4 all your replies so far

**onlyplace4** · 07-03-2005, 11:34 AM

Try this:

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
	<title>Untitled</title>
</head>
<style type="text/css">
body {
scrollbar-3dlight-color:#000000;
scrollbar-arrow-color:#000000;
scrollbar-base-color:#000000;
scrollbar-track-color:#000000;
scrollbar-darkshadow-color:#000000;
scrollbar-face-color:#D3D3D3;
scrollbar-highlight-color:;
scrollbar-shadow-color:#000000;
}
</style>
<body>
<textarea cols="16" rows="6">
Works here fine in both browser and text area!

Make sure that you don't change the style class by putting a '.' in front of it</textarea>
</body>
</html>

Works for me

**Rufo** · 07-03-2005, 11:40 AM

Do not use coloured scrollbars. Not only is it only compatible with a couple of browsers, but it is illegal as defined in the W3's specification.

Quote:

Originally Posted by W3C

Some browsers (IE, Konqueror) have recently started supporting the non-standard properties 'scrollbar-shadow-color', 'scrollbar-track-color' and others. These properties are illegal: they are neither defined in any CSS specification nor are they marked as proprietary (by prefixing them with "-vendor-").

Quote:

Originally Posted by onlyplace4

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
	<title>Untitled</title>
</head>
<style type="text/css">
body {
scrollbar-3dlight-color:#000000;
scrollbar-arrow-color:#000000;
scrollbar-base-color:#000000;
scrollbar-track-color:#000000;
scrollbar-darkshadow-color:#000000;
scrollbar-face-color:#D3D3D3;
scrollbar-highlight-color:;
scrollbar-shadow-color:#000000;
}
</style>
<body>
<textarea cols="16" rows="6">
Works here fine in both browser and text area!

Make sure that you don't change the style class by putting a '.' in front of it</textarea>
</body>
</html>

The <style> section goes between <head> and </head>.
<style> as a sibling of <head> (child of <html>) is incorrect.

**onlyplace4** · 07-03-2005, 12:25 PM

OOOOooooooooooooops, misplaced the style when I tried that out

I know that coloured scrollbars are not within the WC3 specifications, but I know a lot of people use them, and I personally feel that if people want to try these things they should if only to learn more about browser compatabilities.

**Rufo** · 07-03-2005, 12:35 PM

I agree, though personally, I feel browser-specific features should be used only when their absence is not detremental to the site design. If one is not aware that such limitations exist, code that was believed to be cross-browser compatible may not function correctly for many visitors, and may even render the site unusable.

Admittedly, this is not a problem with coloured scrollbars.

**onlyplace4** · 07-03-2005, 12:55 PM

Couldn't agree more. Mind you, I often neglect the W3C specs, but I always make sure, in those instances, that I check things between browsers. I am a great one for experimenting and playing with the code, and I know that if I was to run a lot of my stuff through a validator it would probably give up the ghost and swear at me

My personal feelings about being able to control elements of the browser, such as the scrollbars, is something best left alone, as many people (myself included) don't like pages that seem to 'take over'. And sites that suddenly expand my browser across my screen make me

and

and immediately look for the little X top right

**TBLTK** · 07-03-2005, 09:19 PM

thanx for all your reply's. It works now. The only reason why I wanted the colour scroll bar was because it didn't match with my pages colour skeem, unlike this page.
BTW: what is the w3?

**fancymoustache** · 07-03-2005, 09:34 PM

W3C basically controls the standards for the internet. If you go to http://validator.w3.org/, you can see if your HTML is valid, according to their standards. Of course, you'll need a valid DOCTYPE to do that. Anyway, It's good practice to get all your webpages validated through them. It will keep your HTML orderly, which is always a plus

. Hope that helped. Maybe someone else can provide a more in depth (and probably better) explanation.

-Micah

HTML Forum

Find a Professional HTML Freelancer!

FREE Outsourcing eBook!