CSS: Difference between revisions

From MozillaWiki
Jump to navigation Jump to search
(→‎Platform priorities: previous recent CRs)
(finished most of the rest of the things, a few things dropped, drop unmaintained dashboard & old meta bugs, forward to GeckoGoalsfor2021#CSS for current CSS priorities)
 
(103 intermediate revisions by 6 users not shown)
Line 1: Line 1:
This is the Mozilla wiki home page for Cascading Style Sheets (CSS).
CSS is short for Cascading Style Sheets (CSS), and typically includes the full set of Selectors, CSS properties, values, and @-rules supported by browsers.
{{Special:PrefixIndex/{{FULLPAGENAME}}/}}
= CSS =
== Platform priorities ==
The following CSS specs/proposal are a priority for the [[Platform]].


=== Actively Implementing ===
CSS is one of several web [[standards]].
==== Flexbox ====
Mozilla has a pretty solid complete [https://www.w3.org/TR/css-flexbox-1/ Flexbox] (W3C CR) implementation. We are working on some fixes to make it even better, e.g.
* [https://bugzilla.mozilla.org/show_bug.cgi?id=812687 812687]


==== Grid ====
For documentation on CSS, how to develop for it, use various properties, see:  
* [https://drafts.csswg.org/css-grid/ CSS Grid] ([https://www.w3.org/TR/2016/CR-css-grid-1-20160929/ CR]) [https://bugzilla.mozilla.org/show_bug.cgi?id=1312610 metabug]
* https://developer.mozilla.org/en/CSS
** [https://bugzilla.mozilla.org/buglist.cgi?quicksearch=%5Bcss-grid%5D lots of work] (including [https://bugzilla.mozilla.org/buglist.cgi?quicksearch=subgrid for subgrid])


==== Shapes ====
<span style="float:right">__TOC__</span>
* [https://drafts.csswg.org/css-shapes/ CSS Shapes] (CR) [https://bugzilla.mozilla.org/show_bug.cgi?id=1040714 metabug]
= CSS =
** [https://bugzilla.mozilla.org/show_bug.cgi?id=1098939 shape-outside]
== Priorities ==
 
* See [[GeckoGoalsfor2021#CSS]]
==== Houdini ====
* [[CSS/Houdini|CSS Houdini]] - see inside for Houdini implementation thoughts/plan
 
==== Box Alignment ====
* [https://drafts.csswg.org/css-align/ CSS Box Alignment] (WD), [https://bugzilla.mozilla.org/show_bug.cgi?id=1105570 metabug]
** all properties for blocks ([https://bugzilla.mozilla.org/show_bug.cgi?id=1040695 1040695], [https://bugzilla.mozilla.org/show_bug.cgi?id=1105571 1105571])
** and some details for flexbox (see 1105570 Depends on)
 
==== Multi-column ====
* [https://www.w3.org/TR/css3-multicol/ CSS Multi-column Layout] (CR), [https://bugzilla.mozilla.org/show_bug.cgi?id=684062 metabug]
** unprefixing, column-span, a11y bug hack removal, column-break
 
==== 3D Transforms ====
* 3D Transform interop / spec changes, [https://bugzilla.mozilla.org/buglist.cgi?quicksearch="3d transform" bugs]
 
==== Inline Layout ====
* [https://drafts.csswg.org/css-inline/ CSS Inline Layout Module Level 3] ([https://www.w3.org/TR/css-inline-3/ TR WD]), [https://bugzilla.mozilla.org/show_bug.cgi?id=1312611 metabug]
** specifically CSS Initial-letter related features ([https://bugzilla.mozilla.org/show_bug.cgi?id=1273019 initial-letter * metabug])
 
==== Masking ====
* [https://drafts.fxtf.org/css-masking-1/ CSS Masking] (W3C [https://www.w3.org/TR/css-masking-1/ CR]), [https://bugzilla.mozilla.org/show_bug.cgi?id=1312613 metabug]
** '[https://drafts.fxtf.org/css-masking-1/#the-clip-path clip-path]' in particular
 
==== Under the hood and related ====
* [https://bugzilla.mozilla.org/show_bug.cgi?id=1243581 Stylo]
* Web Animations API
* PDF support
* Intersection observer
* Resize observer
 
=== Evaluating ===
* Colors 4 syntax
* Color improvements (wide gamut, color correction, note CSS color correction preffed off)
* [https://drafts.csswg.org/mediaqueries-4/#mf-interaction CSS Media Queries 4] work (interaction, negation, etc) - https://bugzilla.mozilla.org/show_bug.cgi?id=1035774
* Selectors4
** CSS [https://drafts.csswg.org/selectors-4/#placeholder :placeholder-shown]
** CSS [https://drafts.csswg.org/selectors-4/#the-focus-within-pseudo :focus-within]
** CSS ::selection fixes + unprefixes
* SVG related
** [] attr function
** [] xywh fragment syntax
** [] SVG image sizing
 
* CSS Containment size/layout, style, paint
 
* CSS Font Loading Improvements, Multiple bugs e.g., https://bugzilla.mozilla.org/show_bug.cgi?id=1157064
* font inflation removed
* style sheet APIs in add-ons SDK / loading async APIs (to be handled by stylo)
* [https://drafts.fxtf.org/filters-2/#BackdropFilterProperty Filter Effects Module Level 2] - [https://bugzilla.mozilla.org/show_bug.cgi?id=1178765 backdrop-filter]
* CSS Transform properties (shorthands)
 
=== Recent CRs ===
At the TPAC 2016 CSS WG f2f, the WG resolved to work on taking the following WDs to CR by end of 2016.
 
Recent CRs before the f2f:
* [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]
*** 'all' property
*** scoped styles, animations, and transitions in the cascade.
 
These have made it into CR since that f2f:
* [https://drafts.csswg.org/css-scroll-snap-1/ Scroll Snap] ([https://www.w3.org/TR/2016/CR-css-scroll-snap-1-20161020/ CR]), [https://bugzilla.mozilla.org/show_bug.cgi?id=1231777 metabug]
** Fix [https://bugzilla.mozilla.org/buglist.cgi?quicksearch=%22scroll+snap%22 related bugs]
 
=== Upcoming CRs ===
These CRs are expected by end of 2016:
 
* Box Alignment (see above)
 
* Grid (see above)
 
* [https://drafts.csswg.org/mediaqueries-4/ Media Queries 4] (note: [https://drafts.csswg.org/mediaqueries-4/#changes-2012 new features in 4]), [https://bugzilla.mozilla.org/show_bug.cgi?id=1312621 metabug]
 
* [https://drafts.csswg.org/selectors-4/ Selectors 4] (need list of [https://github.com/w3c/csswg-drafts/issues/622 changes since 3]), [https://bugzilla.mozilla.org/show_bug.cgi?id=693083 metabug]
 
* [https://drafts.csswg.org/css-text/ Text] (need list of [https://www.w3.org/Style/CSS/Tracker/actions/799 changes since CSS 2.1]), [https://bugzilla.mozilla.org/show_bug.cgi?id=104960 metabug]
 
For all potential CRs:
* Which browsers have openly announced implementations or intent to implement? (links?)
 
=== Related HTML5 ===
[[HTML5]] layout and presentation related work:
* [https://bugzilla.mozilla.org/show_bug.cgi?id=1149357 srcset intrinsic size]
* dialog element (fullscreen interactions, and since [https://bugzilla.mozilla.org/show_bug.cgi?id=981796 showModalDialog being deprecated/removed]) [https://bugzilla.mozilla.org/show_bug.cgi?id=840640 #840640]
* ...
 
 
=== Shipping Soon ===
As the above priorities get implemented, moving down here to note we're waiting for them to ship.
 
49:
* [https://drafts.fxtf.org/masking/ CSS Masking] ([https://www.w3.org/TR/css-masking-1/ 2014 CR]), https://bugzilla.mozilla.org/show_bug.cgi?id=686281
* CSS handling of HTML5 &lt;details> &lt;summary> - https://bugzilla.mozilla.org/show_bug.cgi?id=591737
* [https://bugzilla.mozilla.org/show_bug.cgi?id=550426 Background-position x/y]
48:
* [https://drafts.csswg.org/css-values-3/#calc-notation calc() for numbers / unit algebra] (CR/WD), https://bugzilla.mozilla.org/show_bug.cgi?id=594933


== properties ==
== properties ==
Line 124: Line 20:
* ...
* ...


=== in development ===
== Previously ==
CSS properties which have not yet made it to a Candidate Recommendation (or later), or are only implemented in the wild in prefixed form.
* 2019 Metabug for CSS Priorities: https://bugzilla.mozilla.org/show_bug.cgi?id=1424418
* 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]]


==== new pseudo-classes ====
== See Also ==
* ...
{{Special:PrefixIndex/{{FULLPAGENAME}}/}}
* [[CSS/:autofill|:autofill]]
* ...
 
==== new properties ====
* ...
* [[CSS/text-size-adjust|text-size-adjust]] (-moz-, -ms-, -webkit-)
* ...
 
== see also ==
* https://developer.mozilla.org/en/CSS
* [[CSS3]]
* [[CSS3]]
* [[HTML5]]
* [[HTML5]]
* [[DOM]]
* [[Standards]]
* [[Standards]]
* [[Platform]]
* [https://developer.mozilla.org/en/CSS MDN: CSS home page]
* [https://wiki.csswg.org/ CSS Working Group Wiki]

Latest revision as of 17:51, 20 April 2021

CSS is short for Cascading Style Sheets (CSS), and typically includes the full set of Selectors, CSS properties, values, and @-rules supported by browsers.

CSS is one of several web standards.

For documentation on CSS, how to develop for it, use various properties, see:

CSS

Priorities

properties

Please add subpages for each (unprefixed) CSS property in alphabetical order.

Previously

See Also

Retrieved from "https://wiki.mozilla.org/index.php?title=CSS&oldid=1235119"