I have an html <dl> list, where each list item is a second <dl>. What I want is for the outer <dl> to use a .gif as it's list-style-image, and the inner to have list-style: none. So I set up two different class identifiers in my .css file and applied them to the lists, however, the inner <dl> is also displaying the .gif. I assume the outer <dl> is cascading onto the inner, despite specifically being assigned to a different class.

Is there a way round this?