【提问】问一个在html页面插入一个水平菜单的问题

在刚做的页面中

这个我是用表格做的，代码如下：
<table width="624" border="0"bgcolor="" class="pos_abs">
<tr>
<td width="130" height="54"bgcolor="#00FFFF"><div align="center"><a href="" class="two">小组赛赛程</a></div></td>
<td width="130"bgcolor="#228B22"><div align="center"><a href="" class="two">淘汰赛赛程</a></div></td>
<td width="130"bgcolor="#FF1493"><div align="center"><a href="" class="two">按时间查询</a></div></td>
<td width="130"bgcolor="#00FF00"><div align="center"><a href="" class="two">电视转播表</a></div></td>
<td width="130"bgcolor="#20B2AA"><div align="center"><a href="" class="two">冠军之路</a></div></td>
</tr>
</table>

如果只是单独做一个水平菜单，感觉效果还是可以的，如下：

代码是：

css代码是：
body{margin:0}
ul
{
float:left;
width:100%;
padding:0;
margin:0;
list-style-type:none;
}
a
{
float:left;
width:7em;
text-decoration:none;
color:white;
background-color:purple;
padding:0.2em 0.6em;
border-right:1px solid white;
}
a:hover
{
background-color:#ff3300;
}
li
{
display:inline;
}

有木有大神说下该怎么改才好？我本来想应该是直接把这个单独做的水平菜单的代码插入，但是试着插入后发现效果不对……求大神指点下哪里有问题啊？

制作的网页是参考这个图片来的……大神们再帮忙看看有点地方还有没有什么好的修改方法……

还想问下，这个原图片上，右边的四个国旗是怎么布局上去的，我自己做的就是把4张图片插入这个表格中的

@圣龍骑士

@军哥绝爱