Question

With CSS Mega Menus, there are many possibilities. But it also mean that I need to handle things like I want to style 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

Answer 1

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..