0

请多多包涵,因为我对手动编写网页还很陌生。我应用了我创建的网站中的 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 中。

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

4

3 回答 3

0

看起来这可能是一个明确的问题。取决于 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
于 2012-12-28T16:27:00.347 回答
0

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

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

如果我使用 IE 开发工具禁用此规则,那么页面似乎可以正常工作(正如我所期望的那样)。

于 2012-12-28T16:51:56.470 回答
-2

Internet Explorer 在 css 中使用图像有一个大问题。每当我尝试使用它们时,它都不起作用。自从最新版本的 IE 以来,他们还没有允许背景图像。

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

不支持背景图片 IE8 或更低版本

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

于 2012-12-28T16:30:29.797 回答