Question

我正在使用WordPress的Twenty Twelve主题。我已根据this tutorial向页脚添加了三个窗口小部件列，其中包含您可能需要查看的所有代码。

使用的唯一额外css：

#colophon {
background: url(http://lenkapage.com/daylight/wp-content/uploads/2014/04/footer-logo.png) no-repeat scroll 20px 20px transparent;
background-color: #00A0E1;
color: white;
padding: 115px 0 0 100px;
margin-bottom:20px;
}

链接到网站：http://lenkapage.com/daylight

结果是带有徽标的蓝色矩形（根据需要），小部件位于其下方。我希望徽标和小部件形成一个页脚块。 如何将小部件包含在蓝色背景中？

一个选项是忘记#colophon并自己设置小部件的样式，但这并不理想，因为它在调整屏幕大小和其他问题时会感到不愉快。造型对我来说不起作用。

由于小部件在代码中的#colophon中，我玩定位（相对等），但这并没有达到预期的效果。我的直觉是这就是答案所在。到目前为止还没有雪茄。

我搜索了wordpress.org，谷歌和堆栈溢出的几个和很多搜索词，但大多数得到如何在页脚上实现三个小部件区域的答案。

非常感谢！

Answer 1

向#colophon添加溢出。这当然会起作用，但你总是可以对这些元素使用clearfix。

#colophon {
    background: url(http://lenkapage.com/daylight/wp-content/uploads/2014/04/footer-logo.png) no-repeat scroll 20px 20px transparent;
    background-color: #00A0E1;
    color: white;
    padding: 115px 0 0 100px;
    margin-bottom: 20px;
    overflow: hidden;
}

WordPress Twenty Twelve主题中的页脚内部样式小部件

1 个答案: