PNG背景图片未在IE 8中显示<使用html5？

Question

我有以下HTML代码:

<section class="first-content-top">
    <img src="images/img-diner.png" />
    <h1>Menu</h1>
</section>
<section class="first-content-middle">
         <article class="menu">
     </article>
</section>
<section class="first-content-bottom"></section>

使用以下类型的css:

.first-content-middle 
{
    background: url("images/bg-black.png") repeat;
    margin: 0 0 0 37px;
    padding: 0 20px;
    width: 595px;
}

但在IE8中,我仍然看不到背景图像,就像我在IE9或firefox中看到的那样:

这是IE8的图片:

这是一张firefox的图片,应该如何:

我尝试了以下解决方案:

为了防止这个问题,我将以下html5shiv代码添加到页面的头部:

<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

在firebug中,我检查以确保section元素具有display:block;属性集.

编辑:将heightcss属性添加到该部分可修复背景问题.但截面高度是可变的.那么我该如何解决这个问题呢？

有什么建议？

Answer 1

您的png背景图片需要至少为4x4px.