html - 如何将 动态设置为正确的长度？

Question

如何设置黄色的高度(动态)<div id="box">适合 <div id="center">不重叠 Hello World部分？

请忽略 jsfiddle 中的 JavaScript，它是其他东西的一部分；p

http://jsfiddle.net/XskMm/3/

感谢您的阅读和回答!

编辑:

对于问题的措辞不佳，我深表歉意。我将尝试准确解释我想要的内容。

主要有两个<div>在页面上。我做了一个灰色和一个黄色。我希望黄色 div 适合灰色 div(长度和宽度)的内部，而不是突出灰色 div 的轮廓。

我的问题是 <h1>和 <hr />正在插入 <div id="box">下来(就像他们应该的那样)，但是 <div id="box">没有收缩到适当的高度，因此它不会延伸到 <div id="center"> 的底部

Answer 1

好的...再试一次。如果这不是您想要的，请告诉我。

工作示例:http://jsfiddle.net/XskMm/8/

代码:

window.onresize = function() { myResizeFunc();  }

function myResizeFunc() {
    var DOMwidth = window.innerWidth? window.innerWidth: window.document.body.parentElement.clientWidth;
    var DOMheight = window.innerHeight? window.innerHeight: window.document.body.parentElement.clientHeight;
    if (DOMwidth>200) { document.getElementById('center').style.width = (DOMwidth-100) + 'px'; }
     else { document.getElementById('center').style.width = '100px'; }
    if (DOMheight>300) {
        document.getElementById('center').style.height = (DOMheight-100) + 'px';
        document.getElementById('box').style.height = (DOMheight-122) + 'px';
    }
     else {
         document.getElementById('center').style.height= '200px';
         document.getElementById('box').style.height= '178px';
    }

}

window.addEvent('domready', function() {
    myResizeFunc();
});