Question

我正在尝试创建以下内容：

http://www.pillerdesigns.com/ftn/design6.jpg

问题在于右下角的民意调查。我更喜欢它坐在窗口的底部，但不管重叠（或不重叠）最新的博客框（右侧边栏），无论最新的博客侧边栏有多长。但如果不出意外，它可能只会在侧边栏之后。

我最关心的部分是覆盖民意调查的狗屋图像，轮询按钮仍然可以点击。此外，这是在WordPress上，所以右侧边栏只有150像素宽，狗窝不知何故需要扩展到其包含侧边栏div。

这可能吗？

这是基本的html结构：

<div id="container">

    <div id="content">
        page content
    </div>

    <div id="primary">
        left sidebar
    </div>

    <div id="secondary">
        right sidebar
    </div>

    <div id="third">
        poll
    </div>

    <div id="footer">
        footer
    </div>

</div>

这是css：

#container {
    float: left;
    width: 100%;
}
#content {
    margin: 0 170px;
}
#primary, #secondary {
    float: left;
    width: 150px;
}
#primary {
    margin: 0 0 0 -100%;
}
#secondary {
    margin: 0 0 0 -150px;
}

#third {
    position: fixed;
    bottom: 0;
    right: 20px;
    width: 150px;
    z-index: -1;
}

#footer {
    clear: left;
    width: 100%;
}

谢谢！

Answer 1

以下是一些选项

这个狗窝位于侧边栏的底部：

http://jsfiddle.net/PfnVd/

以下示例的狗窝位于网站底部。（最可能在你的页脚之上。）

http://jsfiddle.net/PfnVd/1

下一个侧边栏内容比前一个链接少 http://jsfiddle.net/PfnVd/2 - 这是为了显示边栏是如何越过“狗屋”div的。

http://jsfiddle.net/PfnVd/3/ - 以img为中心..

http://jsfiddle.net/PfnVd/4/ - 内容较长。

http://jsfiddle.net/PfnVd/5/ - 文字..

在所有这些中，您可以像往常一样在图像上添加文字。

带有重叠图像的底部DIV - 这甚至可能吗？

1 个答案: