CSS: Difference between revisions

4,155 bytes removed ,  21 August 2019
remove landed and intent/ship features, note others need reprioritizing / re-evaluating
(Added Shadow Parts spec. link and Bugzilla bugs)
(remove landed and intent/ship features, note others need reprioritizing / re-evaluating)
Line 13: Line 13:
'''In Progress''': Updating 2018 completions and reprioritizing for '''[[#2019_Priorities|2019]]'''
'''In Progress''': Updating 2018 completions and reprioritizing for '''[[#2019_Priorities|2019]]'''
* List from DevRel kept here: http://mozdevs.github.io/devrel-dashboard/ in CSS and Layout sections
* List from DevRel kept here: http://mozdevs.github.io/devrel-dashboard/ in CSS and Layout sections
=== 2018 Priorities ===
These are *in progress* 2018 Priorities for CSS features in Firefox.
* Bugzilla: https://bugzilla.mozilla.org/show_bug.cgi?id=1424418
* Bugzilla: https://bugzilla.mozilla.org/show_bug.cgi?id=1424418
* Some public input: https://twitter.com/t/status/939273644043366400
* Subsequently discussed by the Platform Layout team at [[Yallhands]] in Austin, Texas (further adjustments are likely)
==== Close to shipping ====
These features have implementations that are already well in progress and thus it is a priority to finish them and ship.
==== Grid Level 2 ====
Grid Level 2, in particular subgrid (use-cases, a11y implications)
* [https://drafts.csswg.org/css-grid-2/ CSS Grid level 2] ([https://www.w3.org/TR/css-grid-2/ W3C WD]) specifically [https://bugzilla.mozilla.org/buglist.cgi?quicksearch=subgrid Bugzilla bugs for subgrid]
* implementing, specification design may change accordingly
* see also for quick use-cases / tutorial:
** http://fantasai.inkedblade.net/style/discuss/subgrid-markup/
* medium mobile potential impact, different grid layouts for different responsive use-cases


=== To Be Reprioritized ===
==== Values and Units 3 ====
==== Values and Units 3 ====
[https://www.w3.org/TR/css3-values/ CSS Values and Units Module Level 3] (CR) [https://bugzilla.mozilla.org/show_bug.cgi?id=741643 metabug]
[https://www.w3.org/TR/css3-values/ CSS Values and Units Module Level 3] (CR) [https://bugzilla.mozilla.org/show_bug.cgi?id=741643 metabug]
Line 48: Line 33:
** Also [https://drafts.csswg.org/mediaqueries-5/#prefers-reduced-motion prefers-reduced-motion] from Level 5 ([https://bugzilla.mozilla.org/show_bug.cgi?id=1365045 #1365045])
** Also [https://drafts.csswg.org/mediaqueries-5/#prefers-reduced-motion prefers-reduced-motion] from Level 5 ([https://bugzilla.mozilla.org/show_bug.cgi?id=1365045 #1365045])
** watch for mobile uptake, especially for mobile layout
** watch for mobile uptake, especially for mobile layout
=== 2018 Medium Priorities ===
2018 medium priorities are "maybe" items that we're not sure we can get to in 2018, but would really like to (had a lot of interest during [[yallhands]]).


==== Containment ====
==== Containment ====
Line 56: Line 38:
** potential impact for mobile layouts, mobile web apps
** potential impact for mobile layouts, mobile web apps
** [http://caniuse.com/containment Chrome shipped in 61]
** [http://caniuse.com/containment Chrome shipped in 61]
=== 2018 Lower Priorities ===
Features or areas that are lower priority based on a number of factors.
=== Actively Implementing ===
Beyond the above priorities, we should continue to actively implement, fix bugs on the following:
* [[Stylo]] ([https://bugzilla.mozilla.org/show_bug.cgi?id=1243581 metabug])
==== Flexbox ====
Mozilla has a pretty solid complete [https://www.w3.org/TR/css-flexbox-1/ Flexbox] (W3C CR, just waiting on feature-interaction tests to go PR) implementation. We are working on some fixes to make it even better, e.g.
* [https://bugzilla.mozilla.org/show_bug.cgi?id=1055888 Metabug for to-be-implemented spec changes]
==== Grid ====
* [https://drafts.csswg.org/css-grid/ CSS Grid] ([https://www.w3.org/TR/2017/CR-css-grid-1-20170509/ CR]) [https://bugzilla.mozilla.org/show_bug.cgi?id=1312610 metabug]
** [https://bugzilla.mozilla.org/buglist.cgi?quicksearch=%5Bcss-grid%5D lots of work]


==== 3D Transforms ====
==== 3D Transforms ====
Line 82: Line 48:
==== Text Decoration ====
==== Text Decoration ====
[https://drafts.csswg.org/css-text-decor-3/ CSS Text Decoration Module Level 3] ([https://www.w3.org/TR/2013/CR-css-text-decor-3-20130801/ 2013 CR]) ([https://bugzilla.mozilla.org/show_bug.cgi?id=1221864 metabug]), e.g.:
[https://drafts.csswg.org/css-text-decor-3/ CSS Text Decoration Module Level 3] ([https://www.w3.org/TR/2013/CR-css-text-decor-3-20130801/ 2013 CR]) ([https://bugzilla.mozilla.org/show_bug.cgi?id=1221864 metabug]), e.g.:
* focusing on text-decoration-skip https://bugzilla.mozilla.org/show_bug.cgi?id=812990
* text-emphasis ([https://bugzilla.mozilla.org/show_bug.cgi?id=1225012 remaining bugs])
* text-emphasis ([https://bugzilla.mozilla.org/show_bug.cgi?id=1225012 remaining bugs])
* [https://bugzilla.mozilla.org/show_bug.cgi?id=770780 text-underline-position]
* [https://bugzilla.mozilla.org/show_bug.cgi?id=770780 text-underline-position]
* What else left for this module? (JS)
* What else left for this module? (JS)
** See "Depends on" in [https://bugzilla.mozilla.org/show_bug.cgi?id=1221864 metabug 1221864] (TÇ)
** See "Depends on" in [https://bugzilla.mozilla.org/show_bug.cgi?id=1221864 metabug 1221864]


==== Writing Modes ====
==== Writing Modes ====
Line 100: Line 65:
* [https://w3c.github.io/web-animations/ Web Animations API] ([https://bugzilla.mozilla.org/show_bug.cgi?id=875219 metabug])
* [https://w3c.github.io/web-animations/ Web Animations API] ([https://bugzilla.mozilla.org/show_bug.cgi?id=875219 metabug])


=== Evaluating ===
=== Re-evaluate ===
==== Font Rendering Controls ====
==== Font Rendering Controls ====
[https://tabatkins.github.io/specs/css-font-display/ CSS Font Rendering Controls Module Level 1] (ED)
[https://tabatkins.github.io/specs/css-font-display/ CSS Font Rendering Controls Module Level 1] (ED)
Line 109: Line 74:
* CSS Font Loading Improvements, Multiple bugs
* CSS Font Loading Improvements, Multiple bugs


==== Other ====
==== Image Values and Replaced Content ====
* font inflation removed
[https://drafts.csswg.org/css-images-4/] (CR)
* CSS Transform properties (shorthands)
* image() function
* [ ] xywh fragment syntax
 
==== Style sheet APIs for Add-ons ====
* style sheet APIs in add-ons SDK / loading async APIs (to be handled by stylo)
 
==== Device Adaptation ====
[https://drafts.csswg.org/css-device-adapt/ CSS Device Adaptation Module Level 1] ([https://www.w3.org/TR/css-device-adapt-1/ WD])


=== Related HTML5 ===
==== Related HTML5 ====
[[HTML5]] layout and presentation related work:
[[HTML5]] layout and presentation related work:
* [https://bugzilla.mozilla.org/show_bug.cgi?id=1149357 srcset intrinsic size]
* [https://bugzilla.mozilla.org/show_bug.cgi?id=1149357 srcset intrinsic size]
* ...
* ...


=== Recent CRs ===
==== Cascading and Inheritance ====
==== Cascading and Inheritance ====
* [https://drafts.csswg.org/css-cascade-3/ CSS Cascading and Inheritance Level 3] ([https://www.w3.org/TR/css-cascade-3/ CR]), [https://bugzilla.mozilla.org/show_bug.cgi?id=1312619 metabug]
* [https://drafts.csswg.org/css-cascade-3/ CSS Cascading and Inheritance Level 3] ([https://www.w3.org/TR/css-cascade-3/ CR]), [https://bugzilla.mozilla.org/show_bug.cgi?id=1312619 metabug]
** [https://drafts.csswg.org/css-cascade-3/#changes-2 New features since CSS2.x]
** [https://drafts.csswg.org/css-cascade-3/#changes-2 New features since CSS2.x]
*** scoped styles, animations, and transitions in the cascade.  
*** scoped styles, animations, and transitions in the cascade.  
=== Upcoming CRs ===
These CRs are expected in 2017:
For all potential CRs:
* Which browsers have openly announced implementations or intent to implement? (links?)
* Box Alignment (see above)


==== Text Level 3 ====
==== Text Level 3 ====
Line 141: Line 104:
** CSS ::selection fixes + unprefixing
** CSS ::selection fixes + unprefixing
** ... remaining new features? (JS)
** ... remaining new features? (JS)
=== Shipping Soon ===
As the above priorities get implemented, moving down here to note we're waiting for them to ship.
==== Image Values and Replaced Content ====
[https://drafts.csswg.org/css-images-4/] (CR)
* image() function
* [ ] xywh fragment syntax
==== Style sheet APIs for Add-ons ====
* style sheet APIs in add-ons SDK / loading async APIs (to be handled by stylo)
==== Device Adaptation ====
[https://drafts.csswg.org/css-device-adapt/ CSS Device Adaptation Module Level 1] ([https://www.w3.org/TR/css-device-adapt-1/ WD])
== properties ==
Please add subpages for each (unprefixed) CSS property in alphabetical order.
* ...
* [[CSS/overflow|overflow]]
* ...
* [[CSS/text-overflow|text-overflow]]
* ...
=== in development ===
CSS properties which have not yet made it to a Candidate Recommendation (or later), or are only implemented in the wild in prefixed form.


==== new pseudo-classes ====
==== new pseudo-classes ====
Line 178: Line 115:
* ...
* ...


=== 2019 Priorities ===
==== Resize Observer ====
==== Resize Observer ====
* Resize Observer ([https://bugzilla.mozilla.org/show_bug.cgi?id=1272409 bugzilla], intent to implement coming)
* Resize Observer ([https://bugzilla.mozilla.org/show_bug.cgi?id=1272409 bugzilla], intent to implement coming)
Line 213: Line 149:
* Bugzilla: [https://bugzilla.mozilla.org/show_bug.cgi?id=1505489 #1505489] and [https://bugzilla.mozilla.org/show_bug.cgi?id=1559074 #1559074]
* Bugzilla: [https://bugzilla.mozilla.org/show_bug.cgi?id=1505489 #1505489] and [https://bugzilla.mozilla.org/show_bug.cgi?id=1559074 #1559074]
* need: browser status(es)
* need: browser status(es)
=== 2019 Medium Priorities ===
These are *in progress* 2019 Priorities for CSS features in Firefox.
* Bugzilla: https://bugzilla.mozilla.org/show_bug.cgi?id=1424418
* Some public input: https://twitter.com/t/status/939273644043366400
* Subsequently discussed by the Layout team at [[Mozlando2018]] (further adjustments are likely)


==== Filter Effects Level 2 ====
==== Filter Effects Level 2 ====
Line 238: Line 168:
** re-evaluate priority of rest of Houdini at this point and re-sort accordingly
** re-evaluate priority of rest of Houdini at this point and re-sort accordingly


=== 2019 Lower Priorities ===
==== Box Alignment ====
==== Box Alignment ====
* [https://drafts.csswg.org/css-align/ CSS Box Alignment] ([https://www.w3.org/TR/css-align-3/ WD]), [https://bugzilla.mozilla.org/show_bug.cgi?id=1105570 metabug]
* [https://drafts.csswg.org/css-align/ CSS Box Alignment] ([https://www.w3.org/TR/css-align-3/ WD]), [https://bugzilla.mozilla.org/show_bug.cgi?id=1105570 metabug]
Line 245: Line 174:
** spec CR depends on resolving [https://github.com/w3c/csswg-drafts/labels/css-align-3 open css-align-3 issues]
** spec CR depends on resolving [https://github.com/w3c/csswg-drafts/labels/css-align-3 open css-align-3 issues]
* unlikely mobile impact (mobile layouts more likely to use flexbox with box alignment properties)
* unlikely mobile impact (mobile layouts more likely to use flexbox with box alignment properties)
==== text-decoration-skip ====
* Bugzilla: https://bugzilla.mozilla.org/show_bug.cgi?id=812990
* parity with Chrome


==== Conic Gradients ====
==== Conic Gradients ====
Line 254: Line 179:
* Bugzilla: https://bugzilla.mozilla.org/show_bug.cgi?id=1175958
* Bugzilla: https://bugzilla.mozilla.org/show_bug.cgi?id=1175958
* [https://www.chromestatus.com/feature/5706155347148800 Supported in Chrome 69+, Opera 56+, Android, and in Safari Technology Preview]
* [https://www.chromestatus.com/feature/5706155347148800 Supported in Chrome 69+, Opera 56+, Android, and in Safari Technology Preview]
==== Shipped and evaluate follow up ====
===== Variable Fonts =====
<span id="Fonts_Level_4">Fonts Level 4</span> for Variable Fonts support in particular:
* Bugzilla for Variable Fonts: https://bugzilla.mozilla.org/show_bug.cgi?id=1302685
**  unlikely mobile impact, do any mobile platforms ship a variable font at all?
* [https://drafts.csswg.org/css-fonts-4/ Fonts 4] ([https://www.w3.org/TR/css-fonts-4/ TR] FPWD 2017), [https://bugzilla.mozilla.org/show_bug.cgi?id=css-fonts-4 metabug]
Reprioritize Fonts Level 4 accordingly once we have Variable Fonts.
===== Shapes =====
* [https://drafts.csswg.org/css-shapes/ CSS Shapes] ([https://www.w3.org/TR/css-shapes/ TR] CR 2014, another CR was expected in 2017) [https://bugzilla.mozilla.org/show_bug.cgi?id=1040714 metabug]
** [https://bugzilla.mozilla.org/show_bug.cgi?id=1098939 shape-outside]
* would make mobile use-cases more compelling and closer to native apps
=== 2019 Needs Reprioritizing ===
These are all items we made progress in 2018 (in some cases shipping features or large portions there of) and need to re-evaluate what’s left (if anything) for 2019


==== Multi-column ====
==== Multi-column ====
Line 276: Line 185:
** Low to no mobile impact, possible tablet impact
** Low to no mobile impact, possible tablet impact
(Jen has a demo of bugs / test page at http://labs.jensimmons.com/examples/multicolumn-3-bug-demo.html)
(Jen has a demo of bugs / test page at http://labs.jensimmons.com/examples/multicolumn-3-bug-demo.html)
==== ---- ====
Former 2018 Lower Priorities, need re-evaluation for 2019:


==== CSS Images 3 ====
==== CSS Images 3 ====
Line 309: Line 215:
* [https://drafts.csswg.org/css-page-3/ CSS Paged Media Module Level 3] ([https://www.w3.org/TR/css3-page/ old 2013 WD]) [https://bugzilla.mozilla.org/show_bug.cgi?id=286443 metabug]
* [https://drafts.csswg.org/css-page-3/ CSS Paged Media Module Level 3] ([https://www.w3.org/TR/css3-page/ old 2013 WD]) [https://bugzilla.mozilla.org/show_bug.cgi?id=286443 metabug]
More specs / features in particular TBD.
More specs / features in particular TBD.
==== Other ====
* font inflation removed
* CSS Transform properties (shorthands)
== properties ==
Please add subpages for each (unprefixed) CSS property in alphabetical order.
* ...
* [[CSS/overflow|overflow]]
* ...
* [[CSS/text-overflow|text-overflow]]
* ...
== Previously ==
* 2018 public input: https://twitter.com/t/status/939273644043366400
** Subsequently discussed by the Platform Layout team at [[Yallhands]] and by the Layout team at [[Mozlando2018]]


== See Also ==
== See Also ==
canmove, Confirmed users
2,675

edits