topics css masking

Proposal CSS Masking

Spec_tags     : css-masking        # in alpha order; or "none"
Owner_tags    : dschulze          # Who's driving the discussion?
Status_tags   : Resolved            # [ Open | Resolved | Closed | Pending ] [, Urgent]?
Added_dt      : 2012-08-28        # Date added as WG discussion request

Action        : Resolve to continue on ED # Or, if Pending, pending what?
                # Some Examples:
# Action        : Pick A, B, or C?
# Action        : Approve the proposal?
# Action        : Discuss problem and provide direction?
# Action        : Help research needed info!
# Action        : Help write proposals!
# Action        : Give feedback!
# Action        : Publish FPWD/WD/LC/CR/PR/REC!

Issue_urls    : http://dvcs.w3.org/hg/FXTF/raw-file/tip/masking/index.html
Proposal_urls : 
Agenda_urls   : # If this is part of an ordered series of related topics, e.g. LC issues, use this to link to the supertopic agenda

Background

The CSS WG and the SVG WG decided to work on a CSS Masking specification in the FXTF. The CSS WG did not decide if the specification should specify the current behavior of browsers:

• 'mask' as a shorthand for 'mask-image' and other properties deriving from 'background' and 'mask-box-image' as shorthand for properties deriving from 'border-image' (WebKit)
• 'mask' that takes a to a 'mask' element to mask arbitrary HTML and SVG content (Firefox)
• 'clip-path' that takes a to a 'clipPath' element to clip arbitrary HTML and SVG content (Firefox)

Further more the new specification unifies both implementations and extends 'clip-path' to take s from CSS Exclusions as shorthand for clipping beside .

The CSS WG needs to decide if we continue with the current specification.

Problem Statement

• Are all properties needed? In question: 'mask-origin', 'mask-attachment' and 'mask-clip'.
• Masking/Clipping on Firefox operates on 'bounding client rect', 'mask-image' on WebKit operate on 'border-box', 'content-box' and 'padding-box'. Both behaviors are reasonable.
• select() and child are new functions/keywords requested by the SVG WG. The sense in the HTML world depends on the definition.

Resolved

• Go on with ED
• Keep 'mask-origin'
• Drop 'mask-attachment'
• 'mask-clip' must allow extending the region beyond border-box.
• Keep 'clip-path'
• Consider making 'clip' shadowing 'clip-path' (or the other way around), 'rect()' would just apply to absolute positioned elements for legacy reasons