CSS列高度和textarea

Question

我有一个带有页眉和页脚的双列布局。 I have created a JSFilddle with demonstrating this

左栏通常比右栏有更多内容。

1. 如何让右列扩展到左列的高度，或者只填充视口的高度？我有一些类似的例子，但没有一个总是位于显示屏底部的页脚。

2. 如何让textarea填充其父级的高度，右栏（我甚至还没有接近解决这个问题）。

Answer 1

I've just edited your jsfiddle.

1. 我们的想法是在右侧列块上设置一个最小高度，让它确定整个内容部分的高度，而不是从其父级继承高度属性。

2. 其次，关于文本区域。这一点很棘手，每当用户调整大小他们的视口时，你需要使用javascript来渲染它，并相应地更新textarea的属性高度。

干杯



• minHeight 非常重要，因为您有一个空的内容容器，并且您不希望将页脚向上推到标题的正下方。因此，minheight可以防止这种情况发生。一旦右栏的高度超过minHeight，父div将相应地扩展。

• 如果您确实希望它始终展开完整的窗口，我认为 h 是视口的高度并没有错。但是我建议使用$（window）.innerHeight而不是Height（）。但同样，这是javascript，你的代码永远不会在不同的浏览器上呈现相同的东西，所以请记住：）

  $（window）.resize（function（）{var h = $（window）.height（）; $（'＃MyTextarea'）。css（'height'，h-300）;}）;