我试图将一个孩子DIV放在父DIV的底部,但我也想让孩子DIV的内容帮助决定父DIV的尺寸.正如我现在所做的那样,子DIV不会影响父DIV的宽度/高度.
// HTML代码：
<div id="parent">
<h3>Top Aligned Title</h3>
<div id="child"></div>
</div>
// CSS代码：
#parent {
background-color:#222;
position: relative;
height: 500px;
}
#child {
background-color:#444;
position: absolute;
bottom: 0px;
width: 100px;
height: 200px;
}
我需要做什么才能实现我想做的事情？我可以放弃绝对/相对CSS规则,只需在父DIV中创建一个表,这将允许我实现底部对齐和指示父级维度的内容.
但是,我想知道是否有办法在CSS中执行此操作,而无需设置父DIV的宽度.
提前致谢！
解决方法
@H_404_21@ 简短的回答是,你所要求的基本上不能用纯CSS / HTML来完成. (至少没有表)你需要Javascript来读取#child的宽度/高度,然后进行你想要做的计算(我不知道)并设置一个新的高度/宽度到#parent.否则,如果你的意思是你希望#child的高度/宽度根据其内容而改变,当然这是原生CSS,只需将它的高度/宽度设置为auto,然后开始在其中添加文本,你会发现它将开始增长适合你的内容.
由于#child位于绝对位置,因此它取自文档的正常流量,因此不会影响#parent.
