Ben Rogers wrote:
>>No, I think we actually agree, it's just that we're misunderstanding one
>>another. I'd better explain what I'm talking about. Roll on ASCII art!
>
>
> Sorry about the confusion. I wasn't referring to how the size of a box is
> calculated in either the W3C box model or the pre-Internet Explorer 6 box
> model. Nevertheless, that ASCII art was pretty impressive!
>
> I'm not sure that there is a specific term for what we're talking about.
> Here's the situation though...
>
> When you specify a relative size (50%) for a block element in CSS, the size
> is calculated based the total size of the containing block. If the container
> is set to auto, then the size of the container is unknown until the
> container has been completely rendered. In such situations, the relative
> size is ignored, defaulting instead to auto. This means that you have to
> know the size of all the box elements in the hierarchy to specify a relative
> size on one.
>
> You can read more about this behavior here:
>
> http://www.quirksmode.org/css/100percheight.html
>
> "The spec says: 'If the height of the containing block is
> not specified explicitly (i.e., it depends on content
> height), the value is interpreted like "auto".'
>
> This means that if you do not define any height at all
> for the containing block, a percentual height of any
> contained block doesn't work: the block becomes once
> again exactly as high as it needs to be.
>
> Even though this rule may in a few cases save the browser
> work in calculating the correct heights of elements, I
> still think that it is far too restrictive and it's
> caused by bad thinking on the part of the standard makers
> and the browser vendors. Counter-intuitive and
> unnecessary rules like this one make our beautiful CSS
> too hard to work with."
>
> Anyway, that's problem number one.
I read that, and I know that issue, but I can't fathom myself where
you'd take the extra height from if this rule wasn't there: the parent's
parent, and if so, how much would you take, and what would the extra
height be calculated relative to.
I think, regardless of the solution, somebody've been dissatisfied.
> To further complicate things, relative
> sizes are calculated based on the size of the containing block. This means
> that you have to know the size and width of all the elements within the
> containing block (all of the adjacent blocks) when specifying the relative
> size of an element.
>
> For example, I've found that trying to approximate the following layout in
> CSS is very difficult.
<snip>
> In addition, each element has (or can have) it's own background color
> specified at the element level. Mostly, I just included the background
> colors to highlight the fact that each element lines up with one another
> regardless in the different content sizes (which I'm artificially
> controlling with the divs).
Went up to my retreat deep in the Ox Mountains and meditated on a
solution. Then, just as it came to me in a flash of blinding light, I
remembered somebody'd already solved this particular problem before:
http://www.redmelon.net/tstme/3cols2/
>>The real problem is that CSS needs a way of saying "if my parent has any
>>free space, give that to me". "auto" means "give me just what I mean",
>>"100%" means "make me fill my parent", but what we need is a "remaining"
>>height, so if you specified:
>
> Heh, I thought that's what this entire thread has been about. I'm not sure
> where the IE vs. W3C box model came from, but the whole point I've been
> trying to make is that you can't specify the size of a block relative to the
> available content area.
Because Isaac was complaining about the box model, and I was trying to
tell him that his problems weren't with the box model.
>><div style="height:100px">
>><div style="height:remaining">Blah!</div>
>><div style="height:remaining">Blah!</div>
>></div>
>
> I don't think it should be implemented this way because I want to be able to
> specify percentages of the "remaining" content area. If, in HTML, I
> specified width="50%" on a table, it would take 50% of the "remaining" area
> or what I've been referring to as the "available content area".
Ah, but I was only giving the simplest implementation. In addition, you
might do something like this:
<div style="height:remaining">
<div style="height:remaining(2)">Blah!</div>
<div style="height:remaining(5)">Blah!</div>
</div>
In this case, the outer div would expand to take up as much of the
remaining height as it could, with the first child taking up 2 units
(2/7) of it's space (the parent having 2 + 5 = 7 units), and the second
taking 5.
"remaining" means the same thing as "remaining(1)", if you haven't
already guessed.
This isn't as redundant as it sounds. You see, you can consider it a
"softer" version of the percentages. Whereas 100% and 50% are just that,
the "remaining" value just gives you the remaining space if it can.
Example:
+
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Special thanks to the CF Community Suite Silver Sponsor - RUWebby
http://www.ruwebby.com
Message: http://www.houseoffusion.com/lists.cfm/link=i:4:188495
Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/4
Subscription: http://www.houseoffusion.com/lists.cfm/link=s:4
Unsubscribe:
http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
Donations & Support: http://www.houseoffusion.com/tiny.cfm/54