可变高度的问题答案

【问题标题】：Issue with variable heights可变高度的问题
【发布时间】：2013-08-19 18:47:02
【问题描述】：

在修改 phpBB 论坛时，我们需要创建自定义主题/帖子视图。

详情请看下图真正的问题是分区 1 和 2。

我使用的代码是updated code

结果是——

【问题讨论】：

您是否尝试过使用#position1 {height: 100%;}，对于位置2，您可以使用#position2 {height: 80%}，对于无滚动的东西，您可以使用position{ overflow: none;}，这将告诉浏览器不创建滚动这个 div 的栏！
是的，我正在这样做。如果我说对了。请查看已编辑的问题。
为什么不把它放在右边呢？您显示的代码有 float: left;
当我在分区 3 甚至分区 2 上执行 float:right 时，会发生这种情况 -> i.imgur.com/dZQm5dD.jpg?1?5177
您是否尝试过使用#position1 {float:left; height: 100%;}，而对于其余的两个div，将它们组合在一个div中作为<div class="pos_two_three"></div>，并在您提供其他两个时，现在给这个.pos_two_three{float: right; height: 100%}的css属性div 不同的宽度。它会起作用的！

标签： html css-float height

【解决方案1】：

无论您设置什么 CSS，只需在文件末尾添加 javascript 代码，例如 ...

<script type="text/javascript">

var h1=document.getElementById('div1').offsetHeight;
var h2=document.getElementById('div2').offsetHeight;
var h3=document.getElementById('div3').offsetHeight;
var h4=parseInt(h2)+parseInt(h3)+"px";

document.getElementById('div1').style.height=h4;
</script>

我运行这段代码，它对我有用。

【讨论】：

我在想是否有任何单一的 CSS 方式来实现这一点！