How to put space between this header?

Im trying to create a html template so im just wondering the only codes i know is center right and left align but how to put space between them


i have this:
http://coding.mousikorama.com/Program/

i want to be like this :

Home Services Help Contact Us


so what is the code to put space between them can you help?

Actually there is very little difference in those two.

You could try using the Line command <li> if you are using icons, you can also specify the width of the icons in the <li> command like this :

<li><a href="{U_PROFILE}"><img src="{T_THEME_PATH}/images/icon-profile.png" width="16" height="16" alt="Profile Icon" />{L_PROFILE}</a></li>

Thats how it's done in phpBB3

The whole code for phpBB navmenu is :

<div class="floatright">
<ul>
<!-- IF S_USER_LOGGED_IN -->
<li class="divider"></li>
<li><a href="{U_PROFILE}"><img src="{T_THEME_PATH}/images/icon-profile.png" width="16" height="16" alt="Profile Icon" />{L_PROFILE}</a></li>
<li class="divider"></li>
<li><a href="{U_PRIVATEMSGS}"><img src="{T_THEME_PATH}/images/icon-pms.png" width="16" height="16" alt="PMS Icon" />{PRIVATE_MESSAGE_INFO}</a></li>
<!-- ENDIF -->
<li class="divider"></li>
<li><a href="{U_LOGIN_LOGOUT}"><img src="{T_THEME_PATH}/images/icon-login.png" width="16" height="16" alt="Login Icon" /><!-- IF S_USER_LOGGED_IN -->{L_LOGOUT}<!-- ELSE -->{L_LOGIN}<!-- ENDIF --></a></li>
</ul>
</div>

First use un ordered listing

HTML:

<!-- inbetween your headtags -->
<style>
.menu ul{list-style: none;}
.menu ul li{ float:left; padding:5px;margin:14px 0; }
.menu ul li a{ float:left; }
</style>
 
<nav class="menu">
    <ul>
      <li><a href="http://example.com">Home</a></li>
      <li><a href="http://example.com">Home</a></li>
      <li><a href="http://example.com">Home</a></li>
    </ul>
</nav>