 <p>You need this:</p> <pre><code>#menuBar #test2 a:hover{ background:url("../images/btTest.jpg") no-repeat top; } </code></pre> <p>To be this:</p> <pre><code>#menuBar #test2:hover a { background:url("../images/btTest.jpg") no-repeat top; } </code></pre> <p>To get it to stick when you move to the <code>.subMenu</code>. This will not work for IE6 (if you care).</p> <p>Also these:</p> <pre><code>#menuBar #test2 a:hover + .subMenu { //submenu show up display:block; } #menuBar li .subMenu:hover { //keep submenu show up when hover in submenu display: block; } </code></pre> <p>Should be able to be replaced with just this:</p> <pre><code>#menuBar li:hover .subMenu { display: block; } </code></pre>