将旧版html表格设计导入div布局

Question

我们正在将我们的遗留网站中的一些旧页面导入我们新的基于DIV的布局中。我们的网站建立在PHP包含系统之上，因此我们将页面拆分为三个组件;标题，正文和页脚。这些旧页面需要用于我们的1.0版本的推出，然后当我们解决所有的皱纹时，我们将重新设计。

我们的标题组件运行得很好，并且正文内容显示应该如此，但不幸的是现有的页脚元素插入到表格的底部。我们的新设计页脚扩展了100％的宽度，但现有的表只允许960px的宽度。因此我们的页脚被切断了。

我们正在尝试找到一个动态解决方案，使用JavaScript或jQuery Attr（）调用来动态地影响表格尺寸以允许页脚扩展到页面边缘，但我尝试过的所有内容都没有修改表格尺寸或允许overfow显示。

以下是一些屏幕截图，供您查看我在说什么。

Div布局：

表格布局：

如果您想查看代码，可以查看我的Demo Page，但只知道这是一个不使用PHP来引入组件的演示版本。它是一个简单的基于HTML / CSS的布局，我一直用它来搜索替代品。 （我不是一个PHP人）

我们试图避免不得不浏览数百个文档并在表格下方剪切和粘贴页脚，或者不得不手动修改任何其他代码。如果我们可以在标题中包含一个CSS或JavaScript文档，那么渲染变通方法就是理想的解决方案。

Answer 1

您还可以使用页脚背景制作div - 与内容和下方分开。在元素后面放一个与'footer'相同的css样式的div。然后你可以从页脚中取出背景图像（footer_bg.jpg repeat-x）。

请参阅campdavidozarks.org获取我使用相同想法制作的网站。

Answer 2

使表格居中，并在父级，100％宽度元素上使用相同的页脚背景，同时对齐底部并且在y上不重复。完成。纯CSS解决方案。