title: CSS Hover disable on tr:hover
body: <p>I have a table and I have a global css code for tr:hover effect. But sometimes I don't want use this hover effect on my tables. Please look to the code and tell me how do I don't run effect on this table. <a href="http://jsfiddle.net/bigboytr/LnbUV/" rel="nofollow noreferrer">JSFIDDLE</a>. There is a css id here. It's name is product-table. I don't clear this css. IT's rule.</p>
  
  <pre><code>#product-table &gt; tbody &gt; tr { cursor:pointer; }
  #product-table &gt; tbody &gt; tr:hover { background:#eee; }
  
  .nohover &gt; tbody &gt; tr { cursor:default !important; }
  .nohover &gt; tbody &gt; tr:hover { background:inherit !important; }
  
  .green_bg { background-color:#090; }
  </code></pre>