# CSS in Javascript

**URL:** <https://forum.kirupa.com/t/css-in-javascript/40672>\
**Category:** web dev\
**Created:** [January 20, 2004, 10:51pm UTC](https://forum.kirupa.com/t/css-in-javascript/40672 "2004-01-20T22:51:23Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![imagined](https://avatars.discourse-cdn.com/v4/letter/i/a87d85/32.png) [@imagined](https://forum.kirupa.com/u/imagined)\
**Post date:** [January 20, 2004, 10:51pm UTC](https://forum.kirupa.com/t/css-in-javascript/40672/1 "2004-01-20T22:51:23Z")

</div>

I have a page that has a Javascript top page navigation bar.

The page uses CSS to set the hyperlink’s properties in the body, but they also affect the links in the Javascript navigation bars.

\<!–  
HOMEPAGE:  
// This line links the page to a CSS file  
\<LINK REL=stylesheet HREF=“CSS/global.css” TYPE=“text/css”\>

//These lines are the Javascript links styles  
\<style\>  
all.clsMenuItemNS, .clsMenuItemIE{text-decoration: none; font: bold 12px Arial; color: white; cursor: hand; z-index:100}  
#MainTable A:hover {color: yellow;}  
\</style\>

–\>

The CSS file global.css superimposes its properties to both the body of the page and the Javascript navigation bar. I don’t want the CSS file to affect the Javascript navigation bar. How can I avoid this?

Thanks in advance,

Leo  
:red: