Hi-
I've got a page that looks fine in FF & validates for both HTML and CSS. In IE, the problem is that each navigation <li> has about a 1em space underneath of it. I've applied line-height, display, margin, padding in every configuration I can think of, but still don't get what I want. Please review and give me your ideas on how to fix this.

Thanks,
KDLA

Page: http://kdla.ky.gov/_test/librarytemp...ntitled-21.htm

Code:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-type" content="text/html; charset=ISO-8859-1" />
<style type="text/css">
body {}
#banner {background-color: #3d7ab8; height: 75px; width: 100%; padding: 1%; text-align: middle; border-bottom: 1px solid #ffffff;}
#banner h1 {color: white; font-family: "trebuchet ms", verdana, arial, sans-serif;}
#navigation {float: left; margin: auto; padding: auto; width: 190px; border-right: 5px solid #660066;}
#navigation ul {list-style-type: none; padding: 0; margin:0; width: 190px;}
#navigation li {display: block; margin: 0; padding: 0;}
#navigation li a{display: block; margin: 0; padding: 5px 10px; text-indent: 0; 
color: white; font-family: "trebuchet ms", verdana, arial, sans-serif; font-weight: bold; 
text-decoration: none; background-color: transparent;
border: 1px solid #ffffff; border-top: 0;}
#navigation li a:active {text-decoration: underline;}
#navigation li a.link1 {background-color: #99cc66;}
#navigation li a.link2 {background-color: #b87a3d;}
#navigation li a.link3 {background-color: #cc9966;}
#navigation li a.link4 {background-color: #003366;}
#navigation li a.link5 {background-color: #cc6666;}
#navigation li a.link6 {background-color: #8a5c2e;}
#navigation li a.link7 {background-color: #3d7ab8;}
#navigation li a.link1:hover, #navigation li a.link2:hover, #navigation li a.link3:hover, #navigation li a.link4:hover, #navigation li a.link5:hover, #navigation li a.link6:hover, #navigation li a.link7:hover {background-color: #A300A3;}
#content {}

</style>
</head>

<body>
<div id="banner"><h1>Kentucky County Public Library</h1></div>
<div id="navigation">
<ul>
<li><a href="#" class="link1">Link 1</a></li>
<li><a href="#" class="link2">Link 2</a></li>
<li><a href="#" class="link3">Link 3</a></li>
<li><a href="#" class="link4">Link 4</a></li>
<li><a href="#" class="link5">Link 5</a></li>
<li><a href="#" class="link6">Link 6</a></li>
<li><a href="#" class="link7">Link 7</a></li>
</ul>
</div>
</body>
</html>