All,

I have to modify a menu where the style sheet is set with like this:

#mainNav li:hover, #mainNav a:hover

I want to suppress the hover with I decide to use a class with the li or a.

ex: #mainNav li.off (no hover)

Is there a way to suppress the hover based on a class?

Does this make sense? In other words, I want to keep the site wide li:hover but I want to suppress it later in a class.

Thanks

Heres a good tut on doing what you want:
http://css.maxdesign.com.au/listutorial/roll11.htm

Thanks but the site didn't help at all. I can't use ID's as there ID's there for the JavaScript. I'm going to need to try to do this with a class.

You can use a class in combination with the :hover selector like this:

li.myclass:hover {
/*override one rule with another here*/
}

You can do the same thing with an ID

That site just used id's for an example assuming that you typically wouldn't need that effect anywhere else on the page. As wayfarer said, just use a class. The css just needs to know what you're referring to.

I don't see how ex: #mainNav li.off (no hover) affects the <a> link?

Did you mean #mainNav li a.off:link ?