I am attempting to change the colour of the scrollbar for the website I am creating. I input the following code, note the code in question is in all caps:

<style type="text/css">
<!--
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
background-color: #026602;
SCROLLBAR-FACE-COLOR: #004f00;
SCROLLBAR-HIGHLIGHT-COLOR: #003300C;
SCROLLBAR-SHADOW-COLOR: #003300;
SCROLLBAR-3DLIGHT-COLOR: #003300;
SCROLLBAR-ARROW-COLOR: #ffffff;
SCROLLBAR-TRACK-COLOR: #003300;
SCROLLBAR-DARKSHADOW-COLOR: #003300;
}

However after reading a post on this site I found that to get it to work I have to remove the top line of code which dreamweaver put in:

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">"

This displays the scollbar correctly, however after removing this top line of code, my font size which I have set smaller than the default, reverts to the default when being displayed in internet explorer.

Is there a way I can have the scrollbar, aswell as having my font size display correctly? Any help is much appreciated.