CSS: Difference between revisions

From MozillaWiki
Jump to navigation Jump to search
(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)
 
(108 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]) including [https://drafts.csswg.org/css-grid/#valdef-display-subgrid subgrid value]
* 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], [https://bugzilla.mozilla.org/show_bug.cgi?id=1098939 shape-outside]
= CSS =
==== Houdini ====
== Priorities ==
* [[CSS/Houdini|CSS Houdini]] - see inside for Houdini implementation thoughts/plan
* See [[GeckoGoalsfor2021#CSS]]
==== Box Alignment ====
* [https://drafts.csswg.org/css-align/ CSS Alignment] (WD), https://bugzilla.mozilla.org/show_bug.cgi?id=1105570
** 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)
 
==== Multicolumn ====
* CSS multicol unprefixing, column-span, a11y bug hack removal, column-break
 
==== 3D Transforms ====
* 3D Transform interop / spec changes
 
==== Inline Layout ====
* [https://drafts.csswg.org/css-inline/ CSS Inline Layout Module Level 3] ([https://www.w3.org/TR/css-inline-3/ TR WD]) - specifically just CSS Initial-letter related features
 
==== Masking ====
* [https://drafts.fxtf.org/css-masking-1/#the-clip-path CSS clip-path] (W3C [https://www.w3.org/TR/css-align-3/ WD])
 
==== 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)
 
=== Upcoming CRs ===
At the TPAC 2016 CSS WG f2f, the WG resolved to work on taking the following WDs to CR by end of 2016.
 
* Box Alignment (see above)
* [https://drafts.csswg.org/css-cascade-3/ Cascade]
** [https://drafts.csswg.org/css-cascade-3/#changes-2 New features since CSS2.x]:
*** 'all' property
*** 'unset' keyword
*** scoped styles, animations, and transitions in the cascade.
* 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://drafts.csswg.org/css-scroll-snap-1/ Scroll Snap] ([https://www.w3.org/TR/2016/CR-css-scroll-snap-1-20161020/ CR])
* [https://drafts.csswg.org/selectors-4/ Selectors 4] (need list of [https://github.com/w3c/csswg-drafts/issues/622 changes since 3])
* [https://drafts.csswg.org/css-text/ Text] ([https://bugzilla.mozilla.org/show_bug.cgi?id=104960 progress], need list of [https://www.w3.org/Style/CSS/Tracker/actions/799 changes since CSS 2.1])
 
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 107: 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"