                        課程
                    
                        /前端開發
                        
                            /JavaScript
                        
                        /JavaScript進階篇

邊框問題。。。

我的寫出來的是第五個左邊框和第四個底邊框的連接處不是圓滑的，而是缺了一個像素的，但是老師的是圓滑的，請問這是怎么回事？

我的html代碼：

<!doctype html>
<html>
<head>
? ?<meta charset="UTF-8">
? ?<title>tab1</title>
? ?<link type="text/css" rel="stylesheet" href="style.css">
</head>
<body>
? ?<div id="notice" class="notice">
? ? ? ?<div id="noticeTitle" class="noticeTitle">
? ? ? ? ? ?<ul>
? ? ? ? ? ? ? ?<li>
? ? ? ? ? ? ? ? ? ?<a href="#">公告</a>
? ? ? ? ? ? ? ?</li>
? ? ? ? ? ? ? ?<li>
? ? ? ? ? ? ? ? ? ?<a href="#">規則</a>
? ? ? ? ? ? ? ?</li>
? ? ? ? ? ? ? ?<li>
? ? ? ? ? ? ? ? ? ?<a href="#">論壇</a>
? ? ? ? ? ? ? ?</li>
? ? ? ? ? ? ? ?<li>
? ? ? ? ? ? ? ? ? ?<a href="#">安全</a>
? ? ? ? ? ? ? ?</li>
? ? ? ? ? ? ? ?<li class="select">
? ? ? ? ? ? ? ? ? ?<a href="#" >公益</a>
? ? ? ? ? ? ? ?</li>
? ? ? ? ? ?</ul>
? ? ? ?</div>
? ?</div>
</body>
</html>

css代碼：

*{
? ?margin:0;
? ?padding:0;
? ?list-style:none;
? ?font-size:12px;
}
.notice{
? ?width:298px;
? ?height:98px;
? ?margin:10px;
? ?border:1px solid #eee;
? ?overflow:hidden;
}
.noticeTitle{
? ?height:27px;
? ?position:relative;

}
.noticeTitle ul{
? ?position:absolute;
? ?width:301px;
? ?left:-1px;
}
.noticeTitle li{
? ?float:left;
? ?width:58px;
? ?height:26px;
? ?line-height:26px;
? ?text-align:center;
? ?overflow:hidden;
? ?padding:0 1px;
? ?background:#f7f7f7;
? ?border-bottom:1px solid #eee;

}
.noticeTitle li.select{
? ?background:#FFF;
? ?border-bottom:#FFFFFF;
? ?border-left:1px solid #eee;
? ?border-right:1px solid #eee;
? ?padding:0;
}
.noticeTitle li a:link,.noticeTitle li a:visited{
? ?text-decoration: none;
? ?color:#000;
}
.noticeTitle li a:hover{
? ?color:#F90;
}