如何解决拉伸div,顶部和底部都有边距-css / css3
|| 我有一个包含div的页面,如下所示;<div id=\"container\">
<div id=\"header\"></div>
<div id=\"content\">
<div id=\"wrap2\"></div>
<div id=\"wrap\"></div>
</div>
<div id=\"footer\"></div>
</div>
我对wrap2
有特定的高度,我希望wrap
填充wrap2
以下但footer
以上的区域。您可以在这里看到小提琴。我想在wrap2
和footer
之间拉伸wrap
。我正在寻找一个纯CSS解决方案。
我怎样才能做到这一点?
解决方法
您不能使用纯CSS。这也许是关于CSS的最大的抱怨。最准确的选择是使用JavaScript。在onload和onresize上调用一个JS函数,该函数获取视口的高度,减去页脚和页眉的高度,然后设置div的高度以填充其余部分。
,我通过将
padding-bottom: 31px;
设置为#content
并将100% height
设置为wrap
来解决它。
你可以在这里看到结果
感谢@ DA,@ Jaspero和@Ima Student
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。