I need to centre align a horizontal menu.
I've tried various solutions, including the mix of inline-block / block / center-align etc., but not being successful.

Can someone help me please? :)

Here is my code:

<div class="topmenu-design">
    <!-- Top menu content: START -->
    <ul id="topmenu firstlevel">                                                                                       
      <li class="firstli" id="node_id_64"><div><a href="#"><span>Om kampanjen</span></a></div></li>
      <li id="node_id_65"><div><a href="#"><span>Fakta om inneklima</span></a></div></li>
      <li class="lastli" id="node_id_66"><div><a href="#"><span>Statistikk</span></a></div></li>
    </ul>
    <!-- Top menu content: END -->
</div>

UPDATE

I know how to center align the UL within the DIV. That can be accomplished using Sarfraz's suggestion. But the list items are still floated left within the UL.

Do I smell javascript to accomplish this?