Wordpress submenu - wordpress

Question

I want to create a horizontal submenu in wordpress with wp_nav_menu();
As it is now I output the whole menu with wp_nav_menu but since the children is outputted inside theire parents I cant make a submenu. Just a dropdown menu.
I want it to look some what like this. Home, articles, about and contact are pages and inspiration, technology and interview are categories.
Home Articles About Contact
Inspiration Technology Interview
(if I have pressed on Articles)
So this is what it looks like:
<ul class="mainmenu">
<li>Home</li>
<li>Articles
<ul class="submenu">
<li>Inspiration</li>
<li>Technology</li>
<li>Interview</li>
</ul>
</li>
<li>About</li>
<li>Contact</li>
</ul>
And this is what I want:
<ul class="mainmenu">
<li>Home</li>
<li>Articles</li>
<li>About</li>
<li>Contact</li>
</ul>
<ul class="submenu">
<li>Inspiration</li>
<li>Technology</li>
<li>Interview</li>
</ul>
Someone got and idea? :) thx

Answer 1

Don't modify template code, you should do this with css.
Sample here : http://jsfiddle.net/2G9dQ/1/

Answer 2

What about using wp_list_pages() instead of wp_nav_menu() so you can have the main and sub menus with something like this:
<ul id="mainmenu">
<?php wp_list_pages("title_li=&depth=1"); ?>
</ul>
<ul id="submenu">
<?php wp_list_pages("title_li=&depth=1&child_of=".$post->post_parent ); ?>
</ul>

Answer 3

Sorry to post a second answer, but it is a completely different solution with jQuery (just one line of js though): http://jsfiddle.net/AFC2r/. The CSS there is obviously just to make it appear clearer.
$(function() {
$(".mainmenu .submenu").detach().insertAfter('.mainmenu');
});
Depending on your needs, soju's CSS-only solution could be better of course.

Answer 4

The easiest way is just create 2 separated menus, in wp-admin.