coloring scrollbars with css??

[- |Flash Man| -]

How can i colour scroll bars in css i have seen heaps of tutorials my css just doesn't recognize the scrollbar: style....any ideas???

[DDD]

outside of the tutorials and stuff you probably have read, I can think of another way. Can you post your css? it works on my end so it has to be an issue with your css.

[- |Flash Man| -]

yeh no probs...my css is below:


/* CSS Document */

body, html {
min-width: 900px;
margin:0;
padding:0;
height: 100%;
text-align:center;
background:#333333;
overflow:auto;
}

#wrapper {
width: 900px;
height: 100%;
background:#222222;
margin: 0 auto;
text-align:left;
position:relative;
}

#theview {
width:900px;
height:210px;
background:url(images/image4.jpg) no-repeat;
top:0px;
position:absolute;
}

#mainmenu {
width: 60px;
height: 100px;
top: 175px;
position:absolute;
}

#searchBG {
width:125px;
height:20px;
padding-left:5px;
background:url(images/image3.png);
margin-left:750px;
top:210px;
position:fixed;
}

#searchButt {
width:50px;
height:20px;
background:url(images/image2.png);
top:210px;
margin-left:700px;
position:fixed;
}

#goButt {
width:31px;
height:20px;
background:url(images/image1.png);
top:210px;
margin-left:870px;
position:fixed;
}

#jobs {
width:200px;
height:200px;
bottom:20px;
left:-100px;
position:absolute;
}

#personalisation {
width:132px;
height:23px;
bottom:40px;
right:220px;
padding-right:6px;
position:fixed;
background:url(images/image.gif);
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
font-weight:bold;
line-height:35px;
color:#EEEEEE;
}

#personliseContent {
width:139px;
height:34px;
bottom:65px;
right:30px;
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
font-weight:bold;
color:#EEEEEE;
position:absolute;
}


Thanks

[duncanhall]

As far as I'm aware, changing the colour of the scroll bars is not part of the W3C recommendation and therefore does not feature in Firefox. IE of course will let you, because it's filth, but I'm fairly certain Firefox will not allow it without some messy javascript intervention.

[- |Flash Man| -]

ahh ok so thats the best thing to do if i want to do it...use some javascript to get a work around in all browsers??

Cheers

[duncanhall]

Um, well in my opinion, the best thing to do is not to do it all. Colour configuration of the scrollars is not included for a reason. I personally don't particularly like sites with coloured scrollbars - 98% of the time it just looks tacky, and there's always the possibility that it could hinder the experience of users who are visually impaired.

[- |Flash Man| -]

hmm i see what you mean and believe me i have seen some really bad sites with bright ugly coloured bars...i was thinking of using a natural colour.

But the other thing how do people use the css (scrollbar: ) code and get it to work i mean it shouldn't work if it's not included right??

[Luggruff]

hmm i see what you mean and believe me i have seen some really bad sites with bright ugly coloured bars...i was thinking of using a natural colour.

But the other thing how do people use the css (scrollbar: ) code and get it to work i mean it shouldn't work if it's not included right??

It's just a feature that microsoft put into their belowed Internet Explorer. Not possible with other browsers.
You can add it, so that it shows up for IE users, just don't base your design around it, messing the whole experience up for the other visitors on your site.
(don't make it a neccesary design-object that need to be there for your site to look allright.. making some parts messed up visually if a visitor uses FF or other browsers)