gpt4 book ai didi

html - 使容器 div 成为一个子 div 的高度,并使另一个子 div 成为容器的高度

转载 作者:行者123 更新时间:2023-11-28 02:18:45 26 4
gpt4 key购买 nike

首先,对这个标题感到抱歉。我不是最擅长写这些东西的人。

我有一个容器 div(我们称它为#container),其中包含两个 div(#a 和 #b)。我无法控制这两个 div 的内容。

我希望#container 是#a 的高度。我还希望 #b 拉伸(stretch)(或缩小,视情况而定)到 #container 的 100%,并在必要时有一个滚动条。

这听起来应该非常简单,但我花了几个小时试图让它发挥作用。

如果这不可能,我会解决这个问题: #container 有固定高度,#b 有固定高度。 #a 有两个 block 级元素(#1 和#2),它们的高度无法控制。 #2 应该是#a 的 100%,减去#1 的高度。

请告诉我其中一个是可能的!

最佳答案

我喜欢这些 CSS 更改(以一种受虐狂的方式)。我很惊讶想出了一个解决方案:

<html>
<head>
<style type="text/css">
html, body, div { margin: 0; padding: 0; }
#container { width: 600px; height: auto; margin: 0 auto; background: orange; position: relative; }
#left { background: green; width: 300px; }
#right { overflow: auto; background: yellow; width: 300px; position: absolute; top: 0; bottom: 0; right: 0; }
</style>
</head>
<body>
<div id="container">
<div id="left">
<p>f this is not possible, I would settle for this: #container has a fixed height, #b has a fixed height. #a has two block-level elements (#1 and #2) that have uncontrollable heights. #2 should be 100% of #a, minus the height of #1.</p>
<div id="right">
<p>I have a container div (let's call it #container) which contains two divs (#a and #b). I am not in control of the content of these two divs.</p>
<p>I want #container to be the height of #a. I also want #b to stretch (or shrink, depending) to 100% of #container, and have a scrollbar, if necessary.</p>
</div>
</div>
</body>
</html>

在左边大于右边的地方试一下,它仍然有效。

可能值得添加 DOCTYPE 以强制 IE 进入稍微不那么糟糕的模式。

关于html - 使容器 div 成为一个子 div 的高度,并使另一个子 div 成为容器的高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1382760/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com