html CSS 导航条的字体大小改变,背景色就会超出,参差不齐,怎么解决

/* 导航 */
nav { 
	background: rgba(0,0,0,0.8); 
	height: 48px; 
	line-height: 48px; 
	padding-left: 80px;
	filter: progid:DXImageTransform.Microsoft.gradient(gradientType = 0, startColorstr = #3333333, endColorstr = #3333333);
}
nav a { 
	display: block;
	font-size: 18px; 
	font-family: "Microsoft Yahei", Arial, Helvetica, sans-serif; 
	color: #FFF; 
	padding: 0 20px;
	float: left; 
	-webkit-transition: all 1s; 
	-moz-transition: all 1s; 
	-o-transition: all 1s; 
	transition: all 1s;
}
nav a:hover{
	background: #e41635;
	font-size:12px;
}

是display: inline-block; 的原因，把display: inline-block; 换成display: block;然后利用浮动（float: left;） 就没有这样的事情出现了。