Question

请耐心等待我，因为我对手工编码我的网页还算新手。我从我创建的网站上应用了我的CSS和HTML来为Blogger页面设置外观以匹配外观。在FireFox版本17.0.1中进行测试时，一切看起来都很好，但我的div #body_wrap 的背景在IE 8中无法重复多次。

我可能遗漏了一些简单的东西，但我很感激在确定原因方面有任何帮助。我想知道它是否与IE有关，或者只是差的代码，FireFox正在勉强维持。

以下是博客的链接：

http://www.zenmotostore.blogspot.com/

以下是涉及的div容器的CSS：

    #body_wrap {
    width: 1074px;
    margin: 0px auto;
    padding: 0px;
    position: relative;
    background: url(http://www.zenmotostore.com/images/repeat_bgd_shadow_blog.png) top repeat-y;
    clear: both;
    }

    #body_content_wrap {
    width: 984px;
    margin: 0px 45px 0px 45px;
    padding: 0px;
    padding-bottom: 7px;
    background: #000000;
    position: relative;
    clear: both;
    }

    #scrollofzen_header {
    width: 983px;
    height: 191px;
    margin: 0px 0px 0px 0px;
    padding: 0px;
    background: #000000 url(http://www.zenmotostore.com/images/scroll_of_zen_header.jpg) top center no-repeat;
    position: relative;
    clear: both;
    }

div #scrollofzen_header 位于HTML中的Blogger内容代码上方。两者都包含在 #body_content_wrap div。

中

如果我需要在帖子中包含更多代码，请告诉我。感谢您提供任何帮助！

Answer 1

看起来这可能是个明确的问题。取决于IE的版本。您可以查看css height: 100%;，或者另一种方法是将<div class="clear></div>添加为#body_wrap中的最后一个子元素。

.clear {
    clear: both;
}

//then the markup

<div id="body_wrap">

    //Your content and stuff

    <div class="clear"></div>

<div> //close body_wrap

Answer 2

您的问题似乎与此CSS声明有关：

.body-fauxcolumn-outer
{
    background: url(http://www.zenmotostore.com/images/page_bgd_zen.jpg) #b8924f fixed no-repeat 50% top;
}

如果我使用IE开发工具禁用此规则，那么页面似乎工作正常（正如我预期的那样）。

Answer 3

Internet Explorer在css中使用图像存在很大问题。每当我尝试使用它们时它都不起作用。不是因为IE的最新版本允许背景图像。

您需要为要拥有背景图像的div定义高度

IE8或以下不支持背景图像

http://www.w3schools.com/cssref/pr_background-image.asp

IE无法在修改后的Blogger页面中重复背景图像

3 个答案: