给定以下 HTML:
<div id="container">
<!-- Other elements here -->
<div id="copyright">
Copyright Foo web designs
</div>
</div>
我想 #copyright
坚持到 #container
的底部。我可以在不使用绝对定位的情况下实现吗?
原文由 Dónal 发布,翻译遵循 CC BY-SA 4.0 许可协议
给定以下 HTML:
<div id="container">
<!-- Other elements here -->
<div id="copyright">
Copyright Foo web designs
</div>
</div>
我想 #copyright
坚持到 #container
的底部。我可以在不使用绝对定位的情况下实现吗?
原文由 Dónal 发布,翻译遵循 CC BY-SA 4.0 许可协议
可能不会。
#copyright
position:relative
#container
position:absolute; bottom:0;
#container {
position: relative;
}
#copyright {
position: absolute;
bottom: 0;
}
<div id="container">
<!-- Other elements here -->
<div id="copyright">
Copyright Foo web designs
</div>
</div>
原文由 User 发布,翻译遵循 CC BY-SA 4.0 许可协议
3 回答874 阅读✓ 已解决
4 回答1.3k 阅读✓ 已解决
2 回答924 阅读✓ 已解决
2 回答1.5k 阅读✓ 已解决
2 回答1.3k 阅读✓ 已解决
2 回答894 阅读✓ 已解决
2 回答1.1k 阅读✓ 已解决
弹性盒方法!
在 支持的浏览器 中,您可以使用以下内容:
这里的例子
上面的解决方案可能更灵活,但是,这里有一个替代解决方案:
这里的例子
作为旁注,您可能希望添加供应商前缀以获得额外支持。