Updating CSS/javascript Weirdness

programming web dev
1

I’d like to update the CSS that goes with an old javascript scroller, but updating the code style breaks the scroller. Here’s the old code:


#divUpControl {position:absolute; left:260px;top:318px; width:270px;height:30px; z-index:40; text-align: right}
#divDownControl {position:absolute; left:260px; top:510px; width:270px;height:30px; z-index:40;text-align: right}
#divContainer {LEFT: 388px; VISIBILITY: hidden; OVERFLOW: hidden; WIDTH:270px; CLIP: rect(0px 320px 170px 0px); POSITION: absolute; TOP: 334px; HEIGHT: 170px; z-index:40;}
#divContent {LEFT: 0px; POSITION: absolute; TOP: 0px; z-index:40;}
body { font: normal 9px Verdana, Arial, sans-serif}
pScroll { font: normal 9px Verdana, Arial, sans-serif}

I’m also finding that I have to add a style into a div tag to get the element style to work in Firefox - it would be great if someone could explain to me why this is happening. I have to use:

<div id="3rdLevelMenu" style="position:absolute; left:389px; top:251px; z-index:50; font-family:Verdana, Arial, sans-serif; font-size:9px; color:#0000FF; line-height:16px;">

In addition to the style sheet code (which will work in later versions of IE):


/*    NOT WORKING in Firefox */
#3rdLevelMenu {    
    position:absolute;
    left:389px;
    top:251px;
    z-index:50;
    font-family:Verdana, Arial, sans-serif;
    font-size:9px;
    color:#0000FF;
    text-decoration:none;
    line-height:16px;
}

I’m attaching a couple of files to compare - “test_submenu.html” shows the submenu floating in the correct position in relation to the scrolling text area, and “bb_specs.html” shows the submenu up in the top left corner - ignoring my CSS. Thanks for your help in advance.