【发布时间】：2011-09-17 17:44:23
【问题描述】：
我几乎查看了这里和 Google 上的所有帖子，但似乎无法找到关于“3 个等高列和一个‘真正’粘页脚”的 CSS 布局问题的答案，以及布局要求如下：
顶部标题部分，其中一行用于下拉菜单选项，另一行用于工具栏按钮。
主要内容部分，具有 3 个等高列。中心列将具有液体宽度，左右列将具有固定宽度。所有 3 列都将具有可变/可变高度，如果内容多于列的可用可见内容区域，则每列将自动显示/使用其自己的滚动条。换句话说，如果任何列的内容较长，则不应将列下方的“粘性”页脚部分向下推，而是显示/使用滚动条供用户滚动浏览内容。
页脚部分（粘滞/固定），无论主内容部分中 3 列中的任何内容的长度如何，它都必须始终在窗口/视口底部可见。页脚不应被其上方的 3 列中的任何一列向下推，并且必须真正“粘性”并且始终在视口上可见。
我确实花了数周时间寻找答案，但我看到的所有关于“（三个）等高带有粘性页脚的列”的解决方案都不会阻止主要内容部分的列“推动”页脚如果任何内容列中有长内容，则向下。
我真的希望有人可以帮助解决这个问题。提前致谢！
【问题讨论】：
-
您好 Keoki，感谢您对回答我的问题感兴趣。实际上，我还没有可以向您展示的 HTML/CSS 代码。我现在拥有的是我需要的布局的手写模型，我正在寻找可以使用的 HTML/CSS 模型或模板。
-
嗨 Keoki，我对 HTML 和 CSS 的了解足以编写一个简单的布局，但我无法编写这个特定的布局： 1. 顶部标题 - 包含 2 行（文本菜单选项、工具栏按钮) 2. 内容区域 - 3 个等高的列（2 个固定宽度的侧边栏，每个包含 2 个面板，中间的一个流体宽度的内容列包含一个文本区域）。如果任何列的内容很长，它将自动显示一个滚动条，用于向上/向下滚动（而不是向下推动“粘性”页脚）。 3. 页脚 - 始终可见的“粘性”页脚，不会被上面的内容列向下推。谢谢Keoki。
-
问题很清楚，我认为NGLN有答案（+1）