Hjælp til CSS

Hej

jeg har nedenstående kode, og det virker næsten ok, mit problem er at jeg gerne vil have mine menupunkter venstre stillet, men hvor dan gør jeg det ? kan man lave det via CSS
som det er nu bliver det centreret, og det ser jo ikke så godt ud

<style type="text/css">
<!--

table.menu {border: 1px solid #393939;}

td.menu, .overskrift {font: bold 11px verdana, sans-serif;text-align: center;}

a.menupunkt {
  text-decoration: none;
  background-color: #EAEAEA;
  color: #717171;
  border-top : 1px solid #FFFFFF;
  border-left : 1px solid #FFFFFF;
  border-bottom : 1px solid #6D6D6D;
  display: block;
  line-height: 22px;
  width:99%;
}

a.menupunkt:hover {
  text-decoration: none;
  background-color: #D1D9F3;
  border-top : 1px solid #8F9CC6;
  border-left : 1px solid #8F9CC6;
  border-bottom : 1px solid #6D6D6D;
  display: block;
  color: #000000;
  width:99%;
}

.overskrift {
  background-color: #8F9CC6;
  color: #000000;
  border-top: 1px solid #D5DFFF;
  border-left: 1px solid #D5DFFF;
  border-bottom: 1px solid #393939;
  line-height: 20px;
}
-->
</style>

<table cellpadding="0" cellspacing="0" border=0 class=menu width=130>
<tr><td><div class=overskrift>Overskrift</div></td></tr>
<tr><td class=menu><a href="link1.html" class=menupunkt>Menupunkt 1</a></td></tr>
<tr><td class=menu><a href="link1.html" class=menupunkt>Menupunkt 2</a></td></tr>
<tr><td class=menu><a href="link1.html" class=menupunkt>Menupunkt 3</a></td></tr>
<tr><td class=menu><a href="link1.html" class=menupunkt>Menupunkt 4</a></td></tr>
</table>