CSS Examples Custom scrollbar colors
Author: CSS Drive
In IE5.5+ and above, you can use CSS to customize the color of the scrollbars on the page, which includes various components of the scrollbar. The below CSS shows the relevant CSS properties for scrollbar coloring. Note that if your page uses a doctype that triggers a "Strict" mode in IE, the scrollbar properties need to be assigned to the "HTML" tag instead of the conventional "BODY" in order to work.
The CSS (for non "strict" doctypes):
body{
scrollbar-face-color:#EBF5FF;
scrollbar-base-color:#EBF5FF;
scrollbar-arrow-color:black;
scrollbar-track-color:#F3F3F3;
scrollbar-shadow-color:#EBF5FF;
scrollbar-highlight-color:#EBF5FF;
scrollbar-3dlight-color:#78AAFF;
scrollbar-darkshadow-Color:#78AAFF;
}
The CSS (for "strict" doctypes):
html{
"
"
}
Comments (21)
Props on posting how to do it in strict css
this website is awsome.....just because of this website i got to know how to change the scrollbar colour...
Always amazes me how people blame I.E. because netscape/firefox doesn't display this css. One protocol should be set, Users don't care about politics, just results. Don't blame I.E. ... well not this time at least ...lol
Hey dropdown, it should work on the select list... make sure you've changed the "body{" part to whatever your dropdown list is titled (it would probably be "select{" instead) or if it has a specific ID parameter, then use that.
Very good,it is working clearly in my browser.Thank you for this code..
onebuttoninfo.netclick2infoplanet.comonebuttonsearch.netsearchbasket.netsupplyinfo.netlearntoreach.comfindandlearn.comteachmemore.netsearchcosmos.netcocoindirectory.comdiscovertoinfo.comcocoinfo.netultimateinfo.netreachtoinfo.comlearn2info.comsurfingforinfo.comtaketolearn.comalwaysdirectory.com
I'd like to comment on what maria said about "netscape/firefox [not displaying] this css". I think it's an unnecessary problem that Firefox, Netscape, IE, Opera, and Safari all work independently and require almost completely different coding in order to get one script to work for everyone. It's too unique, too proprietary. Wasn't one of the major reasons behind making the internet was so everyone could be on the same page? Wasn't it meant to have one universal format so all the computers could comminucate with ease? I guess we've missed the reason behind it, huh? Oh, well I guess.
-Josh
GO FIREFOX!!! WOOT!!!
Scroll bar style is work perfactly in internet but not show color of scrollbar in Mozila
I know this thread is old, but I wanted to say thanks for posting this information. I recently started running IE7 and was going nuts trying to get the scrollbar colors to show in our forums, which use frames. We do a lot of custom themes, and it's important they look nice, both to us and our members. I changed 'body' in the css file to 'html, body' and the scrollbar colors showed right up on refresh. I know it's probably not proper css, and may not work in other browsers, but considering about 80+% of our members use some version of IE, I think this is going to wok out really nice for us. Thanks again
css lessons - css scrollbar examples code
-- http://css-lessons.ucoz.com/scroll-css-examples.htm --