IE中<span>标签发布后无法显示

<div runat="server" id="div_manage" title="系统管理" icon="icon-sys" style="padding:10px;overflow:auto;">
                <ul>
                    <li>
                        <div><a target="mainFrame" href="Manager/ManageCourses.aspx"><span class="icon-daycalendar" style="padding:2px 8px">&nbsp;</span>日程管理</a></div>
                    </li>
                    <li>
                        <div><a target="mainFrame" href="Manager/ManageTeacher.aspx"><span class="icon-teachers" style="padding:2px 8px">&nbsp;</span>讲师管理</a></div>
                    </li>
                    <li>
                        <div><a target="mainFrame" href="Manager/ManageElectCourses.aspx"><span class="icon-courses" style="padding:2px 8px">&nbsp;</span>选课管理</a></div>
                    </li>
                    <li>
                        <div><a target="mainFrame" href="Manager/SampleFiles.aspx"><span class="icon-download" style="padding:2px 8px">&nbsp;</span>示例文件</a></div>
                    </li>
                </ul>
            </div>

.icon{background:url(../Images/tabicons.png) no-repeat; }
.icon-sys{ background:url(../Images/directory.png) no-repeat;}
.icon-add{background:url(../Images/tabicons.png) no-repeat; background-attachment:fixed; background-position: -19px 0px;}
.icon-nav{background:url(../Images/tabicons.png) no-repeat; background-attachment:fixed; background-position: -100px -19px;}
.icon-users{background:url(../Images/tabicons.png) no-repeat; background-position: -100px -480px;}
.icon-role{background:url(../Images/tabicons.png) no-repeat; background-position: -360px -200px;}
.icon-set{background:url(../Images/tabicons.png) no-repeat; background-position: -380px -200px;}

.icon-log{background:url(../Images/tabicons.png) no-repeat; background-position: -380px -80px;}

.icon-datacalendar{background:url(../Images/tabicons.png) no-repeat; background-position: -140px -340px;}
.icon-yearcalendar{background:url(../Images/tabicons.png) no-repeat; background-position: -220px -420px;}

.icon-report{background:url(../Images/tabicons.png) no-repeat; background-position: -240px -80px;}
.icon-select{background:url(../Images/tabicons.png) no-repeat; background-position: -240px -400px;}

.icon-download{background:url(../Images/tabicons.png) no-repeat; background-position: -340px 0px;}
.icon-teachers{background:url(../Images/tabicons.png) no-repeat; background-position: -160px -480px;}
.icon-daycalendar{background:url(../Images/tabicons.png) no-repeat; background-position: -100px -80px;}

.icon-courses{background:url(../Images/tabicons.png) no-repeat; background-position: -120px -60px;}

我在VS2010中调试是ok的，发布后用IE无法看到<span>中的背景图片(注意：发布后用http://localhost/xx还是可以的，但换成ip地址就不行了)，用Firefox却可以看到。

最后的解决办法就是在<span></span>中添加一个空格&nbsp;

如果谁有更好的解决办法，请告诉我，谢谢！