CSS rollover menu in table cell not rendering the way I think it shoul

[vagrant68]

Please forgive my ignorance as I am a noob at css. I am trying to use these styles for a navbar I want to place in a table cell, but when I add the navbar list items into the table cell the cell grows higher than I want it to. Can anyone tell me why this happens and how to fix it.

Here is my css

<style type="text/css" media="screen">
	#mainnav
	{
		margin: 0px;
		padding 0px:
		background-color: #fff12b;
		height: 20px;
		font-family: arial, helvetica, sans-serif;
	}
	
	ul#navlist
	{
		margin-left: 0;
		padding-left: 0;
		white-space: nowrap;
		font-family: arial, helvetica, sans-serif;
	}
	
	#navlist li
	{
		display: inline;
		list-style-type: none;
		font-family: arial, helvetica, sans-serif;
	}

	#navlist a {
		padding: 3px 10px; 
		font-family: arial, helvetica, sans-serif;
	}

	#navlist a:link, #navlist a:visited
	{
		color: #00ACEC;
		background-color: #fff12b;
		font-family: arial, helvetica, sans-serif;
	}

	#navlist a:hover
	{
		color: #fff12b;
		background-color: #00ACEC;
		font-family: arial, helvetica, sans-serif;
	}
	
</style>

Here is my html

<tr>
<td width="720" bgcolor="#FFFF00" height="20" colspan="3">
<div id="mainnav">
<ul id="navlist">
<li><a href="#">Smart Toolz</a></li>
<li><a href="#">Most Toolz</a></li>
<li><a href="#">Winplex API</a></li>
<li><a href="#">Printplex</a></li>
<li><a href="#">CardAppz</a></li>
<li><a href="#">Contact Us</a></li>
</ul>
</div>
</td>
</tr>

Thanks folks

 

[cLFlaVA]

Altered Stylesheet:

    #mainnav
    {
        margin: 0px;
        padding: 0px:
        background-color: #fff12b;
        height: 20px;
        font-family: arial, helvetica, sans-serif;
    }
    
    #navlist
    {
        margin: 0;
		padding: 0;
        font-family: arial, helvetica, sans-serif;
    }

	#navlist ul {
        padding: 0;
		margin: 0;
	}
    
    #navlist li {
        display: inline;
        list-style-type: none;
        font-family: arial, helvetica, sans-serif;
    }

    #navlist a {
        padding: 3px 10px;
        font-family: arial, helvetica, sans-serif;
    }

    #navlist a:link, #navlist a:visited {
        color: #00ACEC;
        background-color: #fff12b;
        font-family: arial, helvetica, sans-serif;
    }

    #navlist a:hover {
        color: #fff12b;
        background-color: #00ACEC;
        font-family: arial, helvetica, sans-serif;
    }

Notice that you'll either have to a)reduce the font size or b) increase the height of the row/div.

*cLFlaVA
----------------------------
Lois: "Peter, you're drunk!"
Peter: "I'm not drunk, I'm just exhausted from stayin' up all night drinking!