Question

我一直在寻找一个解决问题的解决方案：如何在this fiddle的第二个内部div中使用screen.availWidth或类似的东西来填补可用空间？有可能吗？

谢谢。

Answer 1

所需的JS：

var _otherDivsTotalWidth = 100;
window.onload = function WindowLoad() {
    var oDiv = document.getElementById("test");
    if (oDiv)
        oDiv.style.width = (document.body.scrollWidth - _otherDivsTotalWidth -30) + "px";
}

这要求你硬编码其他DIV元素的总宽度，可以在代码中读取..在上面的代码中添加这样的东西应该不复杂。

Answer 2

这可能是你想要的：

<div style="position: relative;">
    <div style="position: absolute; width:50px;border:1px solid red;left: 0;">1</div>
    <div id="test" style="border: green 1px solid; margin: 0 50px;">2</div>
    <div style="position: absolute; width:50px;border:1px solid red;right: 0; top: 0;">3</div>
</div>

修改：您的问题看起来像3列布局：http://css-discuss.incutio.com/wiki/Three_Column_Layouts

如何使用JS填充可用空间？

2 个答案: