那些遇到过的问题

相关疑难解决方法(0)

将 div 的高度指定为容器的 100% 减去同级 div 的高度

我在以下布局中有一个 div

<html style="height:100%">
<body style="height:100%">
    <div id="divBody" style="height:100%;width:1000px">
        <div id="divHeader" style="height:30px"></div>
        <div id="divContent" style="height:100%">
            <div id="divLeft" style="height:100%; float:left; width:200px; border-left:1px solid black"></div>
            <div id="divRight" style="width:800px"></div>
        </div>
    <div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

我的问题是 divContent 的高度如何为 body 的 100%。我需要它做的是占据 divBody 的整个高度减去 divHeader 的高度。所以我将 divContent 的高度设置为 auto：

<html style="height:100%">
<body style="height:100%">
    <div id="divBody" style="height:100%;width:1000px">
        <div id="divHeader" style="height:30px"></div>
        <div id="divContent" style="height:auto">
            <div id="divLeft" style="height:100%; float:left; width:200px; border-left:1px solid black"></div>
            <div id="divRight" style="width:800px"></div>
        </div>
    <div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

现在divContent的高度是正确的，它是divBody的100％减去divHeader的高度，但是现在divLeft的高度没有填充其父级（divContent）的100％。我怎样才能在这里两全其美？

html css

Jer*_*emy
lucky-day
4
推荐指数
1
解决办法
4438
查看次数

标签 统计

css ×1

html ×1