- From: James Ross <w3c-20040125@james-ross.co.uk>
- Date: Wed, 12 Mar 2014 15:50:33 +0000
- To: Axel Dahmen <brille1@hotmail.com>, "www-style@w3.org" <www-style@w3.org>
> From: brille1@hotmail.com > Date: Wed, 12 Mar 2014 15:13:34 +0100 > > See here: > http://stackoverflow.com/questions/15999282/css3-how-can-i-set-middle-div-to-maximum-height > > > I suggest to introduce a new literal keyword to the “height” property. > > This new keyword is supposed to set the height of a box element to the > maximum possible value after > subtracting all the heights of sibling boxes from the viewport height, > thus the box will exactly fit the > viewport’s height. > > The minimum height of such box, however shall be the minimum height > necessary to show its full content. > > I suggest the new height literal value to be named “fit”. > > If more than a single sibling box has the “fit” value assigned to its > “height” property, and if there > is still room left in the viewport after adding all of those boxes’ > minimum heights plus their sibling > boxes’ heights, then the remaining height shall be distributed between > all “fit” boxes. Here is an example of how you can do this with Flexbox [1] which works in current Internet Explorer (11), Firefox (27) and Chrome (33): http://jsfiddle.net/bqurA/1/ Flexbox is already quite well supported in browsers [2] and polyfills exist [3] for others. [1] http://www.w3.org/TR/css3-flexbox/ [2] http://caniuse.com/flexbox [3] http://flexiejs.com/ -- James Ross <james@james-ross.co.uk>
Received on Wednesday, 12 March 2014 15:51:02 UTC