gpt4 book ai didi

css - HTML5/CSS - div 拉伸(stretch)大于 body 100%

转载 作者:太空宇宙 更新时间:2023-11-04 05:13:38 26 4
gpt4 key购买 nike

我正在尝试布置一个 Web 应用程序并遇到 div 延伸到 body 和 html 之外的问题。

http://jsfiddle.net/dex3703/Pftpu/

当设置为 100% 高度时,粉红色的内部 div 会延伸到其容器之外。为什么会这样,我该如何解决?

最佳答案

  • #header 的高度为 55px。
  • #topnav 的高度为 65px。
  • #mainsection 的高度为 90%。
  • #drawer 的高度为 50px。

您试图断言 55px + 65px + 90% + 50px = 100%,但您不能那样做。对于某些高度(整个内容的高度为 1700 像素,见下文),这将是正确的,但不是所有高度:

55px + 65px + 90% + 50px = 100%
55px + 65px + 50px = 10%
170px = 10%
1700px = 100%

编辑:您可以通过适本地使用相对/绝对位置来实现您想要的。请参阅以下 jsFiddle:http://jsfiddle.net/Pftpu/12/

请注意,由于整个页面周围的边框,这仍将大于 100%。您可以将它们包装在另一个 div 中,但我想通过仅更改与您遇到的主要问题相关的 CSS 属性来展示此示例。

关于css - HTML5/CSS - div 拉伸(stretch)大于 body 100%,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8718578/

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