html - 在IE 7和IE 8中看不到任何背景图片

由于某些原因，iE8和IE7的行为不像其他浏览器，并且相对位置元素背景图片也没有出现。

有什么建议吗？

HTML

<div id="container1">
    <div class="main-column">
         <h2>Hello tittle 1</h2>

        <div class="text-column">
            <p>I'm on column 1 and I like it</p>
            <p>I'm on column 1 as well</p>
        </div>
    </div>
    <div class="main-column">
         <h2>Hello tittle 2</h2>

        <div class="text-column">
            <p>I'm on column 2 and I like it</p>
            <p>I'm on column 2 as well</p>
        </div>
    </div>
    <div class="main-column">
         <h2>Hello tittle 3</h2>

        <div class="text-column">
            <p>I'm on column 3 and I like it</p>
            <p>I'm on column 3 as well</p>
        </div>
    </div>
</div>

笔记：

a）绝对位置而不是相对位置会破坏所有布局。

b）我的背景声明中有空格，所以这不是空格问题。

试试我：

相同的标记，但现在具有绝对位置：

#container1 {
    background-color: red;
    text-align: center;
}

.main-column {
    display: inline-block;
}

.main-column h2 {
    width: 220px;
    height: 235px;
    padding-top: 110px;
    position: absolute; /* <<-- Changed */
    background: url('http://s24.postimg.org/ossqwb7hh/carica_Kairos.png') no-repeat center top;
    margin: 0 auto;
}

.text-column {
    width: 220px; /* <<-- Make it equal to the h2 */
    height: 300px;
    background-color: yellow;
    margin: 120px auto 0 auto;
    padding-top: 270px; /* <<-- Adjust */
}

.text-column p {
    padding: 0 50px;
}

同样的问题。 IE8和IE7不显示图像。 :(

最佳答案

我不太确定您要做什么，但是由于h2是一个阻止项，因此它可能不符合您的身高/宽度CSS。我会浮动或绝对定位。

关于html - 在IE 7和IE 8中看不到任何背景图片，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/17959308/