问题如图所示：
尝试去掉div标签中font-size:0; 发现可以垂直居中，但是a标签间有间隙。请问是什么原因？？
贴上源码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style type="text/css">
body,div,a{
margin: 0;
padding: 0;
}
.box1{
width: 596px;
height: 96px;
margin: 20px auto;
border: 2px dashed #000;
text-align: center;
font-size: 0;
line-height: 96px;
}
.box1 a{
display: inline-block;
width: 98px;
height: 28px;
border: 1px solid gold;
text-decoration: none;
font: 16px/28px "Microsoft YaHei";
margin-left: -1px;
}
</style>
<title>Web编程技术</title>
</head>
<body>
<div class="box1">
<a href="#">测试</a>
<a href="#">测试</a>
<a href="#">测试</a>
<a href="#">测试</a>
</div>
</body>
</html>
