Techie-Gyan

Subscribe via Email

 

Styling Scrollbars – CSS

Styling scroll bar can be a requirement when you want to match with rest of styles on your page or on your website. If you do not apply CSS on scroll bars, the default look will be based on browser or operating system you are using. You can not do this styling for all browsers as you’ll need to view your page with Internet Explorer 5.5+. (Most other browsers use the browser default and do NOT support scrollbar colors.

There are certain CSS properties which are used for styling scroll bars. You can generally apply these attributes for body element or textarea element. Please find below the properties:

1. scrollbar-base-color: #009966;
2. scrollbar-track-color: #009966;
3. scrollbar-face-color: #ffff99;
4. scrollbar-highlight-color: #009966;
5. scrollbar-3dlight-color: #009966;
6. scrollbar-darkshadow-color: #009966;
7. scrollbar-shadow-color: #009966;
8. scrollbar-arrow-color: #009966;

Below is an example(Will work with IE only):

<br /> Some text which is written here to make scroll.Some text which is written here to make scroll.Some text which is written here to make scroll.Some text which is written here to make scroll.Some text which is written here to make scroll.Some text which is written here to make scroll.Some text which is written here to make scroll.Some text which is written here to make scroll.Some text which is written here to make scroll.Some text which is written here to make scroll.Some text which is written here to make scroll.Some text which is written here to make scroll.<br />

Most Commented Posts

• Using Jquery – Check boxes and Radio buttons
• How to edit /etc/fstab when at Fedora “Repair filesystem” prompt?
• Ajax File upload – Jquery Plugin

If you enjoyed this post, please consider to leave a comment or subscribe to the feed and get future articles delivered to your feed reader.

Powered by Wordpress | WP Premium theme by WP Remix
Copyright 2008. Techie-Gyan. All rights reserved

• Home
• About