W3C home > Mailing lists > Public > www-style@w3.org > May 2004

Re: Percentage height meaurements.

From: Justin Wood <jw6057@bacon.qcc.mass.edu>
Date: Thu, 27 May 2004 17:16:21 -0400
Message-ID: <40B65AA5.8020405@bacon.qcc.mass.edu>
To: Richard York <richy@smilingsouls.net>, www-style@w3.org

Richard York wrote:

>
> Hello,
> I am currently writing a Beginning CSS book for Wiley. I've hit a snag
> in explaining percentage height measurements.
>
> I have an example looking somthing like this:
>
> html, body {
>     height: 100%;
>     margin: 0;
> }
>
> div {
>     padding: 10px;
>     margin: 10px;
>     height: 100%;
>     border: 1px solid black;
> }
>
> Obviously this results in the <div> element spanning vertically larger
> than the available window area, since padding, margins and borders are
> added in addition to the 100% measurement.
>
> My question is, are there any solutions available or in the proposal
> stage that would allow a designer to utilize the 100% measurement minus
> the length of margins, padding and borders. I've done quite a bit of
> digging in the specifications and have come up naught so far.
>
> I've seen proposals for the %% unit and I've also seen calc() floating
> around. Where the solution would be:
>
>     height: calc(100% - 42px);
>
> Though I haven't yet found a reference to calc() in the specifications.
> Not sure if that's just theoretical at this point or something really
> being added to CSS.
>
> Any insight would be greatly appreciated!
>
> Regards,
> Richard York
>
IIRC calc is not offiicial yet, though is an idea people have been 
floating around..

The solution to your problem, which IS NOT a final spec though (so not 
sure how good it would be to put in a book) is the css-property:  
'box-sizing'  in the CSS3 Box Model spec [1].

After looking, it appears there is erratta about that, make sure to read.

~Justin Wood

[1]  http://www.w3.org/TR/2002/WD-css3-box-20021024/
Received on Thursday, 27 May 2004 17:17:39 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Monday, 27 April 2009 13:54:30 GMT