Re: 'clip' property and the behavior on 'auto'

On Oct 11, 2012, at 8:30 AM, Dirk Schulze <dschulze@adobe.com> wrote:

> 
> On Oct 11, 2012, at 8:21 AM, Dirk Schulze <dschulze@adobe.com> wrote:
> 
>> 
>> On Oct 11, 2012, at 7:15 AM, Robert Longson <longsonr@gmail.com> wrote:
>> 
>>> 
>>>> In CSS 2.1 it says
>>>> 
>>>> 'auto' The element does not clip.
>>> SVG is precisely on how to use 'auto'. I don't think that "Firefox implements CSS 2.1" means that SVG can't override the definition. That is why I ask if we can remove this clarification for SVG elements.
>>> 
>>> What I really meant was that we parse rect arguments per CSS 2.1 rather than per CSS 2.0 which is not compliant with SVG 1.1 but, I hope will be compliant with SVG 2
>> Yes, it is in the current draft of SVG2 and in CSS Masking (which replaces the section in SVG) as well.
>> 
>>> 
>>> 
>>>> 
>>>> If you want clipping you need an overflow value other than visible (This value indicates that content is not clipped per CSS 2.1) and you want the svg width/height to be larger than the clip region to see clipping occur.
>>> 'overflow' with 'visible' says:
>>> 
>>> "This value indicates that content is not clipped, i.e., it may be rendered outside the block box."
>>> 
>>> It could be interpret that this is a general statement. I would just interpret that it is not clipped by the 'overflow' property. After all Firefox allows clipping with 'clip-path', so this seems not to be the reason:
>>> 
>>> CSS 2.0 was more explicit in this regard. http://www.w3.org/TR/1998/REC-CSS2-19980512/visufx.html#clipping I don't know whether the sentence was removed because it was tautologous or wrong though. 
>> I see, this is different in CSS 2.1 indeed. CSS 2.1 has less restrictions. Do I understand that both is implemented this way in SVG and HTML for Firefox? I would need to test other browsers as well.
> I wrote a test for 'overflow: visible' and 'clip: rect()' to test behavior across all browsers on HTML. The 'clip' property clips if 'overflow' is set to 'visible' (initial value). Here is my test file:
> 
> <!DOCTYPE html>
> <html lang="en">
> <head>
> <meta charset="utf-8">
> <style>
> #a {
> 	width: 200px;
> 	height: 200px;
> 	background-color: blue;
> 	position: absolute;
> 	overflow: visible;
> 	clip: rect(0, 200px, 200px, 0);
> }
> #b {
> 	width: 500px;
> 	height: 500px;
> 	background-color: blue;
> }
> </style>
> </head>
> <body>
> <div id="a">
> <div id="b">
> </div>
> </div>
> </body>
> </html>
> 
> The result is a blue rect with the size 200x200 pixel. It looks like all browsers (including Firefox) implement 'clip' on HTML according to CSS 2.1.
> 

The latest version of Firefox nightly supports 'clip' in combination with 'overflow: visible' on SVGSVGElements now! Seems to be fixed recently. It still ignores clipping for 'auto'. It seems to clip to the viewport for 'rect(auto, auto, auto, auto)' as well. This is not clarified by SVG, but makes sense in comparison to the behavior in HTML (where this clips to the border box).

Greetings,
Dirk

> Greetings,
> Dirk
> 
> 
>> 
>> Greetings,
>> Dirk
>> 
>> 
>>> 
>>> Best regards
>>> 
>>> Robert.
>>> 
>> 
>> 
> 
>

Received on Thursday, 11 October 2012 15:48:01 UTC