Hey, I can't figure out why I can't change the scroll bar colors on my site. The only thing I can think of that might cause it not to work is because the site is in a directory. Its a second version of my site so I put it in a folder named "version2". So that might me the reason it won't work. Here is the code on my home page. Just so you know it won't work no matter where I put it on the page.
<==============code====================>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
<html>
<head>
<STYLE TYPE="text/css">
A:LINK {color: #c0c0c0; text-decoration: none}
A:VISITED {color: #c0c0c0; text-decoration: none}
A:HOVER {color: #820000; text-decoration: none}
A:ACTIVE {color: #5b0000; text-decoration: none}
<!--
body
{
scrollbar-arrow-color : #5B0000;
scrollbar-face-color : #000000;
scrollbar-shadow-color :#000000;
scrollbar-dark-shadow-color : #000000;
scrollbar-base-color : #000000;
scrollbar-3d-light-color : #000000;
scrollbar-highlight-color : #808080;
}
-->
</STYLE>
<title>Miseria Cantare</title>
</head>
<body bgcolor="101010" font="ffffff" link="696969">
<script type='text/javascript'>
//HV Menu v5.411- by Ger Versluis (<!-- m --><a class="postlink" href="http://www.burmees.nl/">http://www.burmees.nl/</a><!-- m -->)
//Submitted to Dynamic Drive (<!-- m --><a class="postlink" href="http://www.dynamicdrive.com">http://www.dynamicdrive.com</a><!-- m -->)
//Visit <!-- m --><a class="postlink" href="http://www.dynamicdrive.com">http://www.dynamicdrive.com</a><!-- m --> for this script and more
function Go(){return}
</script>
<script type='text/javascript' src='http://www.webdeveloper.com/forum/archive/index.php/js/exmplmenu_var.js'></script>
<script type='text/javascript' src='http://www.webdeveloper.com/forum/archive/index.php/js/menu_com.js'></script>
<noscript>Your browser does not support script</noscript>
<table width="754" border="1" cellspacing="0" cellpadding="2" align="center" bgcolor="#000000" bordercolor="303030">
<tr>
<td>
<table width="750" border="0" cellspacing="0" cellpadding="0" bgcolor="#000000"> <img src=http://www.webdeveloper.com/forum/archive/index.php/"images/topbanner5.jpg"> <tr>
<td height="0" valign="bottom" align="right" colspan="2">
<table width="605" border="0" cellspacing="0" cellpadding="0"> <tr>
<td rowspan="3" valign="top"></td>
<td height="0" background="bgmenuM.gif" class="menu" align="center">
<div id="gdnav" style="position:relative; width:549; height:20;"><img src=http://www.webdeveloper.com/forum/archive/index.php/"transparent.gif" width="549" height="0"></div>
</td>
<td rowspan="3" valign="top"> </td>
</tr>
<tr>
<td><img src=http://www.webdeveloper.com/forum/archive/index.php/"bgmenuB.gif" width="1" height="5"></td>
</tr>
<tr>
<td>
</td>
</tr>
</table>
</td>
</tr>
<tr valign="top">
<td>
<table width="163" border="1" cellspacing="4" cellpadding="0" bordercolor="303030">
<tr>
</tr>
<iframe src=http://www.webdeveloper.com/forum/archive/index.php/"side1.html" name="side1" width="150" height="1200" hspace="0" vspace="0" align="left" scrolling="no" frameborder="0"></iframe>
<br><br>
</table>
<table width="163" border="0" cellspacing="4" cellpadding="0">
<tr>
<td valign="top">
<p align="center"><br>
</table>
</td>
<td width="587" bgcolor="#000000">
<img src=http://www.webdeveloper.com/forum/archive/index.php/"images/title1.gif">
<div align="center"><width="750" height="240"></div>
<table width="587" border="0" cellspacing="12" cellpadding="0" bgcolor="#000000">
<tr>
<td valign="top">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td rowspan="2" width="7" valign="top"></td>
<td height="20">
<font size="2" color="ffffff">
Welcome to MiseriaCantare.com!!<br><br>This site is a tribute to the band AFI. (aka A Fire Inside) On this site you can find info on the members of the band as well as all of thier releases. You will also find some rare mp3s, streaming video, many promo pics and live pics, an AFI art page, contests and also a Messageboard and Guestbook! I plan on adding many more to the site too.
<br><br>
I hope you enjoy the site and if you have anu questions pleese feel free to <a href=http://www.webdeveloper.com/forum/archive/index.php/"mailto:[email protected]">contact me.</A>
<br><br>
Thank you,<br> George Robarge/Webmaster
</table>
</body>
</html>Scroll bars are a part of MY browser, not YOUR site - leave them alone. What you are attempting to use is IE only feature that thankfully wont work in user friendly browsers.Have you tried building a style sheet that sits outside your document?
<link rel="stylesheet"
type="text/css"
media="all" href=http://www.webdeveloper.com/forum/archive/index.php/"your_styleSheet.css" />
I like the custom scrollbars on a lot of sites. However, it is often overdone. Make sure that you are not building your user experience around the use of custom scrollbars. Why? Because it only works in IE. I used them on <!-- w --><a class="postlink" href="http://www.ailema.com">www.ailema.com</a><!-- w --> and they work fine. I wish more browsers would support things like that. That may be a while though... NS still doesnt support padding very well.
Anyway, I would try bringing in a new css file. It's a good habit to get into anyway. You can change the style sheet by changing one file instead of going into each file that has the css hard coded into it.
Hey I am not sure if this willl be at any help, but this style works for me
scrollbar-face-color: #C2DADA;
scrollbar-highlight-color: #FFFFFF;
scrollbar-shadow-color: #FFFFFF;
scrollbar-3dlight-color: #FFFFFF;
scrollbar-arrow-color: #000000;
scrollbar-track-color: #FFFFFF;
scrollbar-darkshadow-color:#FFFFFF;
it is a bit different from your (not the colors) it seems you have some extra '-' I don't know if this makes a diffenrence.
asbjoernIf you are going to use a XHTML Strict Doctype, at least use the full version. A partial one throws some browsers into quirks mode. Second, validate your pages. It's pretty pointless to use a XHTML Strict Doctype and then fill your page with invalid code. Just note the scroll bar color thing is not W3C recommended and thus won't validate.
<==============code====================>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
<html>
<head>
<STYLE TYPE="text/css">
A:LINK {color: #c0c0c0; text-decoration: none}
A:VISITED {color: #c0c0c0; text-decoration: none}
A:HOVER {color: #820000; text-decoration: none}
A:ACTIVE {color: #5b0000; text-decoration: none}
<!--
body
{
scrollbar-arrow-color : #5B0000;
scrollbar-face-color : #000000;
scrollbar-shadow-color :#000000;
scrollbar-dark-shadow-color : #000000;
scrollbar-base-color : #000000;
scrollbar-3d-light-color : #000000;
scrollbar-highlight-color : #808080;
}
-->
</STYLE>
<title>Miseria Cantare</title>
</head>
<body bgcolor="101010" font="ffffff" link="696969">
<script type='text/javascript'>
//HV Menu v5.411- by Ger Versluis (<!-- m --><a class="postlink" href="http://www.burmees.nl/">http://www.burmees.nl/</a><!-- m -->)
//Submitted to Dynamic Drive (<!-- m --><a class="postlink" href="http://www.dynamicdrive.com">http://www.dynamicdrive.com</a><!-- m -->)
//Visit <!-- m --><a class="postlink" href="http://www.dynamicdrive.com">http://www.dynamicdrive.com</a><!-- m --> for this script and more
function Go(){return}
</script>
<script type='text/javascript' src='http://www.webdeveloper.com/forum/archive/index.php/js/exmplmenu_var.js'></script>
<script type='text/javascript' src='http://www.webdeveloper.com/forum/archive/index.php/js/menu_com.js'></script>
<noscript>Your browser does not support script</noscript>
<table width="754" border="1" cellspacing="0" cellpadding="2" align="center" bgcolor="#000000" bordercolor="303030">
<tr>
<td>
<table width="750" border="0" cellspacing="0" cellpadding="0" bgcolor="#000000"> <img src=http://www.webdeveloper.com/forum/archive/index.php/"images/topbanner5.jpg"> <tr>
<td height="0" valign="bottom" align="right" colspan="2">
<table width="605" border="0" cellspacing="0" cellpadding="0"> <tr>
<td rowspan="3" valign="top"></td>
<td height="0" background="bgmenuM.gif" class="menu" align="center">
<div id="gdnav" style="position:relative; width:549; height:20;"><img src=http://www.webdeveloper.com/forum/archive/index.php/"transparent.gif" width="549" height="0"></div>
</td>
<td rowspan="3" valign="top"> </td>
</tr>
<tr>
<td><img src=http://www.webdeveloper.com/forum/archive/index.php/"bgmenuB.gif" width="1" height="5"></td>
</tr>
<tr>
<td>
</td>
</tr>
</table>
</td>
</tr>
<tr valign="top">
<td>
<table width="163" border="1" cellspacing="4" cellpadding="0" bordercolor="303030">
<tr>
</tr>
<iframe src=http://www.webdeveloper.com/forum/archive/index.php/"side1.html" name="side1" width="150" height="1200" hspace="0" vspace="0" align="left" scrolling="no" frameborder="0"></iframe>
<br><br>
</table>
<table width="163" border="0" cellspacing="4" cellpadding="0">
<tr>
<td valign="top">
<p align="center"><br>
</table>
</td>
<td width="587" bgcolor="#000000">
<img src=http://www.webdeveloper.com/forum/archive/index.php/"images/title1.gif">
<div align="center"><width="750" height="240"></div>
<table width="587" border="0" cellspacing="12" cellpadding="0" bgcolor="#000000">
<tr>
<td valign="top">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td rowspan="2" width="7" valign="top"></td>
<td height="20">
<font size="2" color="ffffff">
Welcome to MiseriaCantare.com!!<br><br>This site is a tribute to the band AFI. (aka A Fire Inside) On this site you can find info on the members of the band as well as all of thier releases. You will also find some rare mp3s, streaming video, many promo pics and live pics, an AFI art page, contests and also a Messageboard and Guestbook! I plan on adding many more to the site too.
<br><br>
I hope you enjoy the site and if you have anu questions pleese feel free to <a href=http://www.webdeveloper.com/forum/archive/index.php/"mailto:[email protected]">contact me.</A>
<br><br>
Thank you,<br> George Robarge/Webmaster
</table>
</body>
</html>Scroll bars are a part of MY browser, not YOUR site - leave them alone. What you are attempting to use is IE only feature that thankfully wont work in user friendly browsers.Have you tried building a style sheet that sits outside your document?
<link rel="stylesheet"
type="text/css"
media="all" href=http://www.webdeveloper.com/forum/archive/index.php/"your_styleSheet.css" />
I like the custom scrollbars on a lot of sites. However, it is often overdone. Make sure that you are not building your user experience around the use of custom scrollbars. Why? Because it only works in IE. I used them on <!-- w --><a class="postlink" href="http://www.ailema.com">www.ailema.com</a><!-- w --> and they work fine. I wish more browsers would support things like that. That may be a while though... NS still doesnt support padding very well.
Anyway, I would try bringing in a new css file. It's a good habit to get into anyway. You can change the style sheet by changing one file instead of going into each file that has the css hard coded into it.
Hey I am not sure if this willl be at any help, but this style works for me
scrollbar-face-color: #C2DADA;
scrollbar-highlight-color: #FFFFFF;
scrollbar-shadow-color: #FFFFFF;
scrollbar-3dlight-color: #FFFFFF;
scrollbar-arrow-color: #000000;
scrollbar-track-color: #FFFFFF;
scrollbar-darkshadow-color:#FFFFFF;
it is a bit different from your (not the colors) it seems you have some extra '-' I don't know if this makes a diffenrence.
asbjoernIf you are going to use a XHTML Strict Doctype, at least use the full version. A partial one throws some browsers into quirks mode. Second, validate your pages. It's pretty pointless to use a XHTML Strict Doctype and then fill your page with invalid code. Just note the scroll bar color thing is not W3C recommended and thus won't validate.