我的星星部分显示不出来，span给了宽度和高度了，但是调试显示的是span.star width和height 都是0，这是什么原因呢？
---------------html部分：------------
<div class="index-panel-body index-food-list">
<ul class="clearfloat">
<li class="food-item">
<a href="#">
<img class="banner" src="../image/demo2.jpg"></img>
<div class="name">Fugiat nulla sint<span class="price">$30</span></div>
<div class="star-bar">
<span class="star"></span>
<span class="star"></span>
<span class="star"></span>
<span class="star"></span>
<span class="star nostar"></span>
</div>
</a>
</li>
</ul>
</div>
---------------css部分：------------
.food-item .banner {
margin-bottom:30px;
height:202px;
}
.index-food-list .name {
color:#555;
margin-bottom:10px;
}
.index-food-list .price {
float:right;
}
.index-food-list .star-bar {
font-size:0;
}
.index-food-list .food-item .star {
display:inline;
height:13px;
width:12px;
margin-right:5px;
background-image:url("../image/index-star.png");
background-repeat:no-repeat;
}
.index-food-list .food-item .noster {
background-position:0 -13px;}
}
