On Apr 28, 2009, at 6:09 AM, Yogurt Earl wrote:

> I am interested in some feedback on some CSS test cases that I put  
> together.
> They combine div's, img's, absolute, relative, top, bottom, right,  
> left,
> percentages in 24 different ways.
>
> These test cases were reductions from some real world problems that  
> I was
> encountering.
>
> I believe this:
> http://www.yogurtearl.com/cssNegativePercentageTest.html
> Should look like this:
> http://www.yogurtearl.com/reference.png
>
> No browser seems to get it 100% right (Opera and Chrome, do the best).
> Did I miss interpret the spec? Do these test case touch "undefined"  
> parts of
> the spec?

Hmm lots of (interesting) variations on this one !

IE 8 and Gecko (fx 3 and newer), Safari 4b render the same.
Opera 10 is different.
WebKit latest nightly is again different.

And of course, IE 7 is again different from everybody else.

The main issue in this test is: can / should a (negative) percentage  
offset from top (top : -50%) compute to something other than '0' when  
the immediate parent has _no_ specified height - and is not absolute  
positioned ?

The consensus in the CSS working group is that it should be possible  
to calculate such and offset
http://lists.w3.org/Archives/Public/www-style/2007Aug/0139.html
http://www.w3.org/TR/2007/CR-CSS21-20070719/changes.html#q53
http://www.w3.org/TR/CSS21/visuren.html#position-props

This latest change has been incorporated in WebKit nightlies (but not  
Safari 4beta).  But it apparently mangles something else, as most of  
the red squares don't appear…
Gecko has an open bug on this issue:
https://bugzilla.mozilla.org/show_bug.cgi?id=260348

The next question is: should this equally apply to a set up where the  
immediate parent has min-height instead of height applied… (I think  
the answer should be yes, as seen in Opera).

Philippe
---
Philippe Wittenbergh
http://l-c-n.com/





______________________________________________________________________
css-discuss [[email protected]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to