Individually place menu items

Question

How can I position each menu item individually in Drupal 7? I've created a quick visualisation how I want it to look like:

The problem is that I still want to have hover effects and highlight the page I'm currently on. The menu don't need to be dynamic because the menu items won't change.

Any Ideas?

Answer 1

Try theme_links

Like

<?php      
print theme('links', array('links' => menu_navigation_links('menu-site-menu'),
'attributes' => array('class'=> array('links', 'site-menu')) ));
?>