css - 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 中，我检查以确保该部分元素具有 display:block; 属性集。

编辑:将 height css 属性添加到该部分修复了背景问题。但截面高度是可变的。那我该如何解决呢？

有什么建议吗？

Answer 1

您的 png 背景图片需要至少为 4x4 像素。