nav-menu-template and columns in sub menu

Question

I am trying to use the wordpress menu setup and have a working horizontal menu with a drop down submenu. Unfortunately the sub enu is quite long so I wanted to split it into columns

I can do it if I hardcode the menu into header.php but that means I have to add new items rather than letting the client do it.

This is a parred down version of what I am trying to achieve

    <div class="headermenucss">

<ul id="topnav">
<li><a href="home.html" class="home">home</a></li>
<li><a href="about.html" class="home">About Us</a>
    <div class="sub">
    <ul>
    <li><a href="services.html">Services</a></li> 
    <li><a href="products.html">Products</a></li>
    </ul>

    <ul>
    <li><a href="terms.html">Terms</a></li>
    <li><a href="privacy.html">Privacy Policy</a></li>
    </ul>

    <ul>
    <li><a href="staff.html">Staff</a></li>
    <li><a href="vacancies.html">Vacancies</a></li>
    </ul>
    </div>
</li>

<li><a href="clients.html" class="home">clients</a></li>
<li><a href="media_centre.html" class="home">media centre</a></li>
<li><a href="contact_us.html" class="home">contact us</a></li>
<li><a href="sitemap.html" class="home">site map</a></li>   
</ul>

</div>

So what I need to do is to be able to loop through the child items and add in the etc as necessary.

Any tips, advice or anyone done this before?? TIA

Answer 1

I think it would be easier for you if you'd stick with the old menu output and used css to emulate your submenu columns. You can left-float the elements in your submenu (while giving them an appropriate with - e.g. 33% for 3 columns), which sorts them horizontally rather than vertically, but otherwise will give you a column-like effect.