CSS Mega Menus: How to target ul's except those in divs

With CSS Mega Menus, there are many possibilities. But it also mean that I need to handle things like I want to s开发者_运维问答tyle children <ul> as nav only if they are not in a div.

I created a jsFiddle http://jsfiddle.net/av5zr/ demonstrating the problem

The list in the 2nd menu should be a normal list. How can I style children ul's as lists only if they are not part of a div? 1 way might be to reset list styles with .megaMenu-hor div ul but I will need to duplicate "normal" list styles in 2 places, in the menu style and in the site's main style, which I prefer to keep separate

I think you can use it like this:

...<li>
        <a href="#">Link 1</a>
        <div class="normal-list"><!--add a class-->
            <p>This is a div</p>
            <ul>...

Then all you need to select it in CSS is this:

.megaMenu-hor div.normal-list ul{
    display: none;  
}

Hope it works..

As far as I know you can't.

Either you need to duplicate your styles to undo the menu <ul /> style for normal <ul />s within a menu OR you need to add a class to the menu <ul />s and target them specifically

EDIT

Just read other answerer's comment. My understanding is that you want to keep the main <ul /> styles and menu <ul /> styles separate. Otherwise an easier suggestion might be to write out your default <ul /> styles like this:

ul,
.megaMenu-hor div ul {
/* whatever */
}