css메뉴바 질문이요 채택완료

가로정렬 메뉴바를 만들었는데 저렇게 빈칸이 생기네요 빈칸없이 붙이고싶은데..

어떻게 해야되나요? 원래 float:left; 였는데 메뉴바를 중앙에 배치하려고 ul 과li에 display:inline-block;로 바꿨더니 저래요. 메뉴바를 중앙에 배치하면서 저 빈칸없애려면 어떻게 해야되나요?

메뉴바css는 이렇습니다..

            /*--게시판코드--*/             #topMenu{                 height:  0px;                 width: 1080px;                  text-align:center;                 margin:0% 10% 0% 8%;             }                          #topMenu ul li{                 list-style: none;                 background-color: #b30000;                 color:white;                 display:inline-block;                 line-height: 30px;                 vertical-align: middle;                 }                          #topMenu .menulink{                 text-decoration:none;                  color:beige;                 display: block;                 width: 150px;                 font-size: 15px;                 font-weight: bold;                 font-family:"Trebuchet MS", Dotum, Arial;                              }             #topMenu .menulink:hover{                 color:#e62e00;                 background-color:#ffe6cc;             }             

어떻게 해야되나요?