How to remove - Space between parent Menu and child menu - html

Question

In the below drop down list, sub menus are getting displayed with lots of space, please see the below chart, Please let me know how do I avoid the space between parent Menu and Child menu.
-----------------------------------------------------------
| PARENT1 |
-----------------------------------------------------------
**SPACE IS HERE**
--------
|CHILD1 |
--------
|CHILD2 |
--------
My CSS Code :-
#navMenu {
margin:0;
padding:0;
}
#navMenu {
margin:0;
padding:0;
}
#navMenu ul{
margin:0;
padding:0;
line-height:30px;
z-index:1;
}
#navMenu li{
margin:0;
padding:0;
list-style:none;
float:left;
position:relative;
background:#8B0F2E;
top: 51px;
left: 10px;
}
#navMenu ul li a {
text-align:center;
font-family:"Comic Sans MS",cursive;
text-decoration:none;
height:30px;
width:150px;
display:block;
color:#FFF;
border:0px solid #FFF;
}
#navMenu ul ul
{
position:absolute;
visibility:hidden;
top:32px;
}
#navMenu ul li:hover ul
{
visibility:visible;
}
#navMenu li:hover
{
background:#09F;
}
#navMenu ul li:hover ul li a:hover
{
background:#CCC;
color:#000;
}
#navMenu a:hover
{
color:#000;
}
.clearFloat
{
clear:both;
margin:0;
padding:0;
}