Hi,
This is a very classic and common problem. :) By definition, a "div" class is applied to all divs in the page and a "td" class is applied to all tds in the page. And our menu uses both of them. So the browser is doing the right thing to apply all them on all DIV and TD items, including those in our menu.
This also means the only way to avoid this problem is to change those rules. One way to do so is to reduce the scope of those rules by changing its selector from a simple element selector to a composite selector, for example, the following rule:
div#abc
{
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 12px;
}
Would not apply to all divs. It would only apply to DIVs with id set to "abc".
You can find more information about those selectors at here:
http://www.w3.org/TR/REC-CSS2/selector.htmlNote even though they are standards, some of them are not implemented by all browsers. So you want to verify them when using it.
Thanks