Im having problems with applying css text variable in this javascript with webkit based browsers(Chrome & Safari) but it works in firefox 3.6

the function:

function addGlobalStyle(sCss) {
    var head = document.getElementsByTagName('head')[0];
    if( !head || head == null ) { return false; }
    var oStyle = document.createElement('style');
    oStyle.type = 'text/css'; oStyle.rel = 'stylesheet'; oStyle.media = 'screen';
    if ( is_gecko ) { // firefox WORKING !!!
        oStyle.href = 'FireFox.css';    oStyle.innerHTML = sCss;
        head.appendChild(oStyle);   return true;
    } else {//nothing but firefox works
        oStyle.href = 'FireFox.css';    oStyle.innerHTML = sCss;
        head.appendChild(oStyle);   return true;
    }
}

the use of the function:

var NewSyleText = //The page styling
"h1, h2, h3, h4, h5 {font-family: 'Verdana','Helvetica',sans-serif; font-style: normal; font-weight:normal;}" +
"body, b {background: #fbfbfb; font-style: normal; font-family: 'Cochin','GaramondNo8','Garamond','Big Caslon','Georgia','Times',serif;font-size: 11pt;}" +
"p { margin: 0pt; text-indent:2.5em;  margin-top: 0.3em; }" +
"a {    text-decoration: none; color: Navy; background: none;}" +
"a:visited {    color: #500050;}" +
"a:active { color: #faa700;}" +
"a:hover {  text-decoration: underline;}";
addGlobalStyle(NewSyleText);//inserts the page styling