添加占用所有可用垂直空间的DIV [英] Add a DIV that takes up all available vertical space

问题描述

 < div style =height：20％; 
 min-height：10px; 
 max-height：100px; 
 width：100％; 
 background-color：blue;>< / div> 
  

我想在此页面后面添加一个DIV，它占用页面上所有剩余的垂直空间。如何做到这一点？

我花了整整一天的时间，CSS开始让我疯狂。

解决方案

这个div里面有什么？

如果它只是一个颜色填充符，只需将您的蓝色div放入另一个div中，让背景颜色变为100％即可。

它看起来就像2个div一样。如果你需要的内容，你可以随时把你的蓝色的另一个div与你想要的任何内容。

编辑：
代码示例：
< a href =http://jsbin.com/efefe/2 =nofollow noreferrer> http://jsbin.com/efefe/2

I have an empty page with one DIV on it:

<div style="height: 20%;
            min-height: 10px;
            max-height: 100px;
            width: 100%;
            background-color: blue;"></div>

I want to add a DIV after this one that takes up all remaining vertical space on the page. How do I do it?

I've spent all day on this and CSS is starting to drive me crazy.

解决方案

What has to be inside this div?

If it's a just a color filler, just put your blue div in a another div wich you give a background color and make that one fit 100% of your browser window?

It will look like 2 divs beneath eachother. If you need content you can always just put another div under your blue one with whatever content you want.

EDIT: code example: http://jsbin.com/efefe/2

这篇关于添加占用所有可用垂直空间的DIV的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！