diff --git a/README.md b/README.md index f04f48a..c17d7c7 100644 --- a/README.md +++ b/README.md @@ -214,7 +214,7 @@ More info: https://www.andismith.com/blogs/2012/02/modernizr-prefixed/ ### Commands -- `yarn build` Generates typings and type checks them -- `yarn watch` Runs build on each save -- `yarn test` Runs the tests -- `yarn lazy` Type checks, lints and formats everything +- `npm run build` Generates typings and type checks them +- `npm run watch` Runs build on each save +- `npm run test` Runs the tests +- `npm run lazy` Type checks, lints and formats everything diff --git a/__tests__/parser.ts b/__tests__/parser.ts index aa58cc1..bbd342a 100644 --- a/__tests__/parser.ts +++ b/__tests__/parser.ts @@ -1,4 +1,4 @@ -import parse, { Combinator, Component } from '../src/parser'; +import parse, { Combinator, Component, Entity } from '../src/parser'; describe('parsing', () => { it('parses combinators', () => { @@ -164,4 +164,10 @@ describe('parsing', () => { {}, ]); }); + + it('parses number with range', () => { + expect(parse('')).toMatchObject([ + { component: Component.DataType, entity: Entity.Component, multiplier: null }, + ]); + }); }); diff --git a/__tests__/typer.ts b/__tests__/typer.ts index 6321566..4f45e96 100644 --- a/__tests__/typer.ts +++ b/__tests__/typer.ts @@ -74,4 +74,8 @@ describe('typing', () => { { type: Type.NumericLiteral }, ]); }); + + it('types number with range', () => { + expect(typing(parse(''))).toMatchObject([{ type: Type.Number }]); + }); }); diff --git a/index.d.ts b/index.d.ts index b23cbf7..d30e878 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1,29 +1,29 @@ export interface StandardLonghandProperties { /** - * The CSS **`align-content`** property sets how the browser distributes space between and around content items along the cross-axis of a flexbox container, and the main-axis of a grid container. - * - * **Syntax**: `normal | | | ? ` - * - * **Initial value**: `normal` + * The **`accent-color`** CSS property sets the color of the elements accent. An accent appears in elements such as `` of `type="checkbox"`, or `type="radio"`. * - * --- + * **Syntax**: `auto | ` * - * _Supported in Flex Layout_ + * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :------: | :-----: | :-------: | :----: | :----: | - * | **29** | **28** | **9** | **12** | **11** | - * | 21 _-x-_ | | 6.1 _-x-_ | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **93** | **92** | **15.4** | n/a | No | * - * --- + * @see https://developer.mozilla.org/docs/Web/CSS/accent-color + */ + accentColor?: AccentColorProperty; + /** + * The CSS **`align-content`** property sets how the browser distributes space between and around content items along the cross-axis of a flexbox container, and the main-axis of a grid container. * - * _Supported in Grid Layout_ + * **Syntax**: `normal | | | ? ` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **57** | **52** | **10.1** | **16** | No | + * **Initial value**: `normal` * - * --- + * | Chrome | Firefox | Safari | Edge | IE | + * | :------: | :-----: | :-----: | :----: | :----: | + * | **29** | **28** | **9** | **12** | **11** | + * | 21 _-x-_ | | 7 _-x-_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/align-content */ @@ -35,25 +35,11 @@ export interface StandardLonghandProperties { * * **Initial value**: `normal` * - * --- - * - * _Supported in Flex Layout_ - * * | Chrome | Firefox | Safari | Edge | IE | * | :------: | :-----: | :-----: | :----: | :----: | - * | **52** | **20** | **9** | **12** | **11** | + * | **29** | **20** | **9** | **12** | **11** | * | 21 _-x-_ | | 7 _-x-_ | | | * - * --- - * - * _Supported in Grid Layout_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **57** | **52** | **10.1** | **16** | No | - * - * --- - * * @see https://developer.mozilla.org/docs/Web/CSS/align-items */ alignItems?: AlignItemsProperty; @@ -64,28 +50,42 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * --- + * | Chrome | Firefox | Safari | Edge | IE | + * | :------: | :-----: | :-----: | :----: | :----: | + * | **29** | **20** | **9** | **12** | **10** | + * | 21 _-x-_ | | 7 _-x-_ | | | + * + * @see https://developer.mozilla.org/docs/Web/CSS/align-self + */ + alignSelf?: AlignSelfProperty; + /** + * The **`align-tracks`** CSS property sets the alignment in the masonry axis for grid containers that have masonry in their block axis. * - * _Supported in Flex Layout_ + * **Syntax**: `[ normal | | | ? ]#` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :------: | :-----: | :-------: | :----: | :----: | - * | **36** | **20** | **9** | **12** | **11** | - * | 21 _-x-_ | | 6.1 _-x-_ | | | + * **Initial value**: `normal` * - * --- + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | No | n/a | No | n/a | No | * - * _Supported in Grid Layout_ + * @see https://developer.mozilla.org/docs/Web/CSS/align-tracks + */ + alignTracks?: AlignTracksProperty; + /** + * The **`animation-composition`** CSS property specifies the composite operation to use when multiple animations affect the same property simultaneously. * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :----------: | - * | **57** | **52** | **10.1** | **16** | **10** _-x-_ | + * **Syntax**: `#` * - * --- + * **Initial value**: `replace` * - * @see https://developer.mozilla.org/docs/Web/CSS/align-self + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | No | n/a | No | n/a | No | + * + * @see https://developer.mozilla.org/docs/Web/CSS/animation-composition */ - alignSelf?: AlignSelfProperty; + animationComposition?: GlobalsString; /** * The **`animation-delay`** CSS property sets when an animation starts. The animation can start later, immediately from its beginning, or immediately and partway through the animation. * @@ -191,10 +191,24 @@ export interface StandardLonghandProperties { * @see https://developer.mozilla.org/docs/Web/CSS/animation-play-state */ animationPlayState?: AnimationPlayStateProperty; + /** + * The **`animation-timeline`** CSS property specifies the names of one or more `@scroll-timeline` at-rules describing the scroll animations to apply to the element. + * + * **Syntax**: `#` + * + * **Initial value**: `auto` + * + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | No | n/a | No | n/a | No | + * + * @see https://developer.mozilla.org/docs/Web/CSS/animation-timeline + */ + animationTimeline?: AnimationTimelineProperty; /** * The `**animation-timing-function**` CSS property sets how an animation progresses through the duration of each cycle. * - * **Syntax**: `#` + * **Syntax**: `#` * * **Initial value**: `ease` * @@ -209,13 +223,14 @@ export interface StandardLonghandProperties { /** * The **`-moz-appearance`** CSS property is used in Gecko (Firefox) to display an element using platform-native styling based on the operating system's theme. * - * **Syntax**: `none | auto | button | textfield | menulist-button | ` + * **Syntax**: `none | auto | textfield | menulist-button | ` * - * **Initial value**: `auto` + * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :---------: | :---------: | :---------: | :----------: | :-: | - * | **1** _-x-_ | **1** _-x-_ | **3** _-x-_ | **12** _-x-_ | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :-----: | :-----: | :------: | :------: | :-: | + * | **84** | **80** | **15.4** | **84** | No | + * | 1 _-x-_ | 1 _-x-_ | 3 _-x-_ | 12 _-x-_ | | * * @see https://developer.mozilla.org/docs/Web/CSS/appearance */ @@ -227,9 +242,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **79** | **71** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **88** | **89** | **15** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/aspect-ratio */ @@ -243,7 +258,7 @@ export interface StandardLonghandProperties { * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :---------: | :----: | :-: | - * | **76** | n/a | **9** _-x-_ | **17** | No | + * | **76** | **103** | **9** _-x-_ | **17** | No | * * @see https://developer.mozilla.org/docs/Web/CSS/backdrop-filter */ @@ -255,10 +270,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `visible` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :------: | :------: | :-----------: | :----: | :----: | - * | **36** | **16** | **5.1** _-x-_ | **12** | **10** | - * | 12 _-x-_ | 10 _-x-_ | | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :------: | :------: | :-------: | :----: | :----: | + * | **36** | **16** | **15.4** | **12** | **10** | + * | 12 _-x-_ | 10 _-x-_ | 5.1 _-x-_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/backface-visibility */ @@ -284,9 +299,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `normal` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **35** | **30** | **8** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **35** | **30** | **8** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/background-blend-mode */ @@ -298,9 +313,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `border-box` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :---------: | :----: | :---: | - * | **1** | **4** | **3** _-x-_ | **12** | **9** | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :-----: | :----: | :---: | + * | **1** | **4** | **14** | **12** | **9** | + * | | | 3 _-x-_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/background-clip */ @@ -347,26 +363,12 @@ export interface StandardLonghandProperties { * @see https://developer.mozilla.org/docs/Web/CSS/background-origin */ backgroundOrigin?: BackgroundOriginProperty; - /** - * The **`background-position`** CSS property sets the initial position for each background image. The position is relative to the position layer set by `background-origin`. - * - * **Syntax**: `#` - * - * **Initial value**: `0% 0%` - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :---: | - * | **1** | **1** | **1** | **12** | **4** | - * - * @see https://developer.mozilla.org/docs/Web/CSS/background-position - */ - backgroundPosition?: BackgroundPositionProperty; /** * The **`background-position-x`** CSS property sets the initial horizontal position for each background image. The position is relative to the position layer set by `background-origin`. * * **Syntax**: `[ center | [ [ left | right | x-start | x-end ]? ? ]! ]#` * - * **Initial value**: `left` + * **Initial value**: `0%` * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :----: | :---: | @@ -380,7 +382,7 @@ export interface StandardLonghandProperties { * * **Syntax**: `[ center | [ [ top | bottom | y-start | y-end ]? ? ]! ]#` * - * **Initial value**: `top` + * **Initial value**: `0%` * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :----: | :---: | @@ -431,9 +433,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **57** | **41** | **12.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **57** | **41** | **12.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/block-size */ @@ -445,9 +447,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `currentcolor` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :--: | :-: | - * | n/a | **66** | No | n/a | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **87** | **66** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/border-block-color */ @@ -459,9 +461,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `currentcolor` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **69** | **41** | **12.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **69** | **41** | **12.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/border-block-end-color */ @@ -473,9 +475,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **69** | **41** | **12.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **69** | **41** | **12.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/border-block-end-style */ @@ -487,9 +489,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `medium` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **69** | **41** | **12.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **69** | **41** | **12.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/border-block-end-width */ @@ -501,9 +503,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `currentcolor` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **69** | **41** | **12.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **69** | **41** | **12.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/border-block-start-color */ @@ -515,9 +517,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **69** | **41** | **12.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **69** | **41** | **12.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/border-block-start-style */ @@ -529,9 +531,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `medium` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **69** | **41** | **12.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **69** | **41** | **12.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/border-block-start-width */ @@ -543,9 +545,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **69** | **66** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **87** | **66** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/border-block-style */ @@ -557,9 +559,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `medium` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **69** | **66** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **87** | **66** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/border-block-width */ @@ -659,7 +661,7 @@ export interface StandardLonghandProperties { * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :--: | :-: | - * | No | **66** | No | No | No | + * | **89** | **66** | **15** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/border-end-end-radius */ @@ -673,7 +675,7 @@ export interface StandardLonghandProperties { * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :--: | :-: | - * | No | **66** | No | No | No | + * | **89** | **66** | **15** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/border-end-start-radius */ @@ -755,9 +757,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `currentcolor` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **69** | **66** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **87** | **66** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/border-inline-color */ @@ -769,10 +771,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `currentcolor` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-------------------------: | :------: | :----: | :-: | - * | **69** | **41** | **12.1** | **79** | No | - * | | 3 _(-moz-border-end-color)_ | | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-------------------------: | :------: | :--: | :-: | + * | **69** | **41** | **12.1** | n/a | No | + * | | 3 _(-moz-border-end-color)_ | | | | * * @see https://developer.mozilla.org/docs/Web/CSS/border-inline-end-color */ @@ -784,10 +786,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-------------------------: | :------: | :----: | :-: | - * | **69** | **41** | **12.1** | **79** | No | - * | | 3 _(-moz-border-end-style)_ | | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-------------------------: | :------: | :--: | :-: | + * | **69** | **41** | **12.1** | n/a | No | + * | | 3 _(-moz-border-end-style)_ | | | | * * @see https://developer.mozilla.org/docs/Web/CSS/border-inline-end-style */ @@ -799,10 +801,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `medium` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-------------------------: | :------: | :----: | :-: | - * | **69** | **41** | **12.1** | **79** | No | - * | | 3 _(-moz-border-end-width)_ | | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-------------------------: | :------: | :--: | :-: | + * | **69** | **41** | **12.1** | n/a | No | + * | | 3 _(-moz-border-end-width)_ | | | | * * @see https://developer.mozilla.org/docs/Web/CSS/border-inline-end-width */ @@ -814,10 +816,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `currentcolor` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :---------------------------: | :------: | :----: | :-: | - * | **69** | **41** | **12.1** | **79** | No | - * | | 3 _(-moz-border-start-color)_ | | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :---------------------------: | :------: | :--: | :-: | + * | **69** | **41** | **12.1** | n/a | No | + * | | 3 _(-moz-border-start-color)_ | | | | * * @see https://developer.mozilla.org/docs/Web/CSS/border-inline-start-color */ @@ -829,10 +831,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :---------------------------: | :------: | :----: | :-: | - * | **69** | **41** | **12.1** | **79** | No | - * | | 3 _(-moz-border-start-style)_ | | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :---------------------------: | :------: | :--: | :-: | + * | **69** | **41** | **12.1** | n/a | No | + * | | 3 _(-moz-border-start-style)_ | | | | * * @see https://developer.mozilla.org/docs/Web/CSS/border-inline-start-style */ @@ -844,9 +846,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `medium` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **69** | **41** | **12.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **69** | **41** | **12.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/border-inline-start-width */ @@ -858,9 +860,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **69** | **66** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **87** | **66** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/border-inline-style */ @@ -872,9 +874,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `medium` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **69** | **66** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **87** | **66** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/border-inline-width */ @@ -986,7 +988,7 @@ export interface StandardLonghandProperties { * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :--: | :-: | - * | No | **66** | No | No | No | + * | **89** | **66** | **15** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/border-start-end-radius */ @@ -1000,7 +1002,7 @@ export interface StandardLonghandProperties { * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :--: | :-: | - * | No | **66** | No | No | No | + * | **89** | **66** | **15** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/border-start-start-radius */ @@ -1098,9 +1100,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `slice` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----------: | :-----: | :-----------: | :----------: | :-: | - * | **22** _-x-_ | **32** | **6.1** _-x-_ | **79** _-x-_ | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----------: | :-----: | :---------: | :--: | :-: | + * | **22** _-x-_ | **32** | **7** _-x-_ | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/box-decoration-break */ @@ -1142,32 +1144,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * --- - * - * _Supported in Multi-column Layout_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :----: | - * | **50** | No | No | **12** | **10** | - * - * --- - * - * _Supported in Paged Media_ - * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :----: | :----: | * | **50** | **65** | **10** | **12** | **10** | * - * --- - * - * _Supported in CSS Regions_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :--: | :-: | - * | No | No | No | No | No | - * - * --- - * * @see https://developer.mozilla.org/docs/Web/CSS/break-after */ breakAfter?: BreakAfterProperty; @@ -1178,32 +1158,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * --- - * - * _Supported in Multi-column Layout_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :----: | - * | **50** | **65** | No | **12** | **10** | - * - * --- - * - * _Supported in Paged Media_ - * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :----: | :----: | * | **50** | **65** | **10** | **12** | **10** | * - * --- - * - * _Supported in CSS Regions_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :--: | :-: | - * | No | No | No | No | No | - * - * --- - * * @see https://developer.mozilla.org/docs/Web/CSS/break-before */ breakBefore?: BreakBeforeProperty; @@ -1214,32 +1172,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * --- - * - * _Supported in Multi-column Layout_ - * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :----: | :----: | * | **50** | **65** | **10** | **12** | **10** | * - * --- - * - * _Supported in Paged Media_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :----: | - * | **50** | **65** | **10** | **12** | **10** | - * - * --- - * - * _Supported in CSS Regions_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :--: | :-: | - * | No | No | No | No | No | - * - * --- - * * @see https://developer.mozilla.org/docs/Web/CSS/break-inside */ breakInside?: BreakInsideProperty; @@ -1264,9 +1200,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **57** | **53** | **11.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **57** | **53** | **11.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/caret-color */ @@ -1292,10 +1228,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :------: | :-----: | :-------: | :----: | :----: | - * | **55** | **3.5** | **9.1** | **12** | **10** | - * | 23 _-x-_ | | 6.1 _-x-_ | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :------: | :-----: | :-----: | :----: | :----: | + * | **55** | **3.5** | **9.1** | **79** | **10** | + * | 23 _-x-_ | | 7 _-x-_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/clip-path */ @@ -1305,7 +1241,7 @@ export interface StandardLonghandProperties { * * **Syntax**: `` * - * **Initial value**: Varies from one browser to another + * **Initial value**: `canvastext` * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :----: | :---: | @@ -1315,19 +1251,34 @@ export interface StandardLonghandProperties { */ color?: ColorProperty; /** - * The **`color-adjust`** CSS property sets what, if anything, the user agent may do to optimize the appearance of the element on the output device. By default, the browser is allowed to make any adjustments to the element's appearance it determines to be necessary and prudent given the type and capabilities of the output device. + * The **`print-color-adjust`** CSS property sets what, if anything, the user agent may do to optimize the appearance of the element on the output device. By default, the browser is allowed to make any adjustments to the element's appearance it determines to be necessary and prudent given the type and capabilities of the output device. * * **Syntax**: `economy | exact` * * **Initial value**: `economy` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :-----------------------------------: | :-----: | :----------------------------------: | :-----------------------------------: | :-: | - * | **49** _(-webkit-print-color-adjust)_ | **48** | **6** _(-webkit-print-color-adjust)_ | **79** _(-webkit-print-color-adjust)_ | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----------: | :-----------------: | :------: | :----------: | :-: | + * | **17** _-x-_ | **97** | **15.4** | **79** _-x-_ | No | + * | | 48 _(color-adjust)_ | 6 _-x-_ | | | + * + * @see https://developer.mozilla.org/docs/Web/CSS/print-color-adjust + */ + colorAdjust?: PrintColorAdjustProperty; + /** + * The **`color-scheme`** CSS property allows an element to indicate which color schemes it can comfortably be rendered in. + * + * **Syntax**: `normal | [ light | dark | ]+ && only?` + * + * **Initial value**: `normal` + * + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **81** | **96** | **13** | n/a | No | * - * @see https://developer.mozilla.org/docs/Web/CSS/color-adjust + * @see https://developer.mozilla.org/docs/Web/CSS/color-scheme */ - colorAdjust?: ColorAdjustProperty; + colorScheme?: ColorSchemeProperty; /** * The **`column-count`** CSS property breaks an element's content into the specified number of columns. * @@ -1365,33 +1316,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `normal` * - * --- - * - * _Supported in Flex Layout_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :---------: | :--: | :-: | - * | No | **63** | **3** _-x-_ | No | No | - * - * --- - * - * _Supported in Grid Layout_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :-------------: | :-------------: | :-------------------: | :----: | :-: | - * | **66** | **61** | **10.1** _(grid-gap)_ | **16** | No | - * | 57 _(grid-gap)_ | 52 _(grid-gap)_ | | | | - * - * --- - * - * _Supported in Multi-column Layout_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :-----: | :-----: | :-----: | :----: | :----: | - * | **50** | **52** | **10** | **12** | **10** | - * | 1 _-x-_ | | 3 _-x-_ | | | - * - * --- + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :----: | :----: | + * | **1** | **1.5** | **3** | **12** | **10** | * * @see https://developer.mozilla.org/docs/Web/CSS/column-gap */ @@ -1474,13 +1401,13 @@ export interface StandardLonghandProperties { /** * The **`contain`** CSS property allows an author to indicate that an element and its contents are, as much as possible, _independent_ of the rest of the document tree. This allows the browser to recalculate layout, style, paint, size, or any combination of them for a limited area of the DOM and not the entire page. * - * **Syntax**: `none | strict | content | [ size || layout || style || paint ]` + * **Syntax**: `none | strict | content | [ [ size || inline-size ] || layout || style || paint ]` * * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **52** | **69** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **52** | **69** | **15.4** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/contain */ @@ -1488,7 +1415,7 @@ export interface StandardLonghandProperties { /** * The **`content`** CSS property replaces an element with a generated value. Objects inserted using the `content` property are _anonymous replaced elements._ * - * **Syntax**: `normal | none | [ | ] [/ ]?` + * **Syntax**: `normal | none | [ | ] [/ [ | ]+ ]?` * * **Initial value**: `normal` * @@ -1499,10 +1426,24 @@ export interface StandardLonghandProperties { * @see https://developer.mozilla.org/docs/Web/CSS/content */ content?: ContentProperty; + /** + * The **`content-visibility`** CSS property controls whether or not an element renders its contents at all, along with forcing a strong set of containments, allowing user agents to potentially omit large swathes of layout and rendering work until it becomes needed. Basically it enables the user agent to skip an element's rendering work, including layout and painting, until it is needed, makes the initial page load much faster. + * + * **Syntax**: `visible | auto | hidden` + * + * **Initial value**: `visible` + * + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **85** | No | No | n/a | No | + * + * @see https://developer.mozilla.org/docs/Web/CSS/content-visibility + */ + contentVisibility?: ContentVisibilityProperty; /** * The **`counter-increment`** CSS property increases or decreases the value of a CSS counter by a given value. * - * **Syntax**: `[ ? ]+ | none` + * **Syntax**: `[ ? ]+ | none` * * **Initial value**: `none` * @@ -1516,7 +1457,7 @@ export interface StandardLonghandProperties { /** * The **`counter-reset`** CSS property resets a CSS counter to a given value. * - * **Syntax**: `[ ? ]+ | none` + * **Syntax**: `[ ? | ? ]+ | none` * * **Initial value**: `none` * @@ -1530,13 +1471,13 @@ export interface StandardLonghandProperties { /** * The **`counter-set`** CSS property sets a CSS counter to a given value. It manipulates the value of existing counters, and will only create new counters if there isn't already a counter of the given name on the element. * - * **Syntax**: `[ ? ]+ | none` + * **Syntax**: `[ ? ]+ | none` * * **Initial value**: `none` * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :--: | :-: | - * | No | **68** | No | No | No | + * | **85** | **68** | No | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/counter-set */ @@ -1634,10 +1575,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `row` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :------: | :-----: | :-----: | :----: | :------: | - * | **29** | **20** | **9** | **12** | **11** | - * | 21 _-x-_ | | 7 _-x-_ | | 10 _-x-_ | + * | Chrome | Firefox | Safari | Edge | IE | + * | :------: | :------: | :-----: | :----: | :------: | + * | **29** | **81** | **9** | **12** | **11** | + * | 21 _-x-_ | 49 _-x-_ | 7 _-x-_ | | 10 _-x-_ | * * @see https://developer.mozilla.org/docs/Web/CSS/flex-direction */ @@ -1649,10 +1590,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :------: | :-----: | :-------: | :----: | :----------------------: | - * | **29** | **20** | **9** | **12** | **11** | - * | 22 _-x-_ | | 6.1 _-x-_ | | 10 _(-ms-flex-positive)_ | + * | Chrome | Firefox | Safari | Edge | IE | + * | :------: | :-----: | :-----: | :----: | :----------------------: | + * | **29** | **20** | **9** | **12** | **11** | + * | 22 _-x-_ | | 7 _-x-_ | | 10 _(-ms-flex-positive)_ | * * @see https://developer.mozilla.org/docs/Web/CSS/flex-grow */ @@ -1679,10 +1620,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `nowrap` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :------: | :-----: | :-------: | :----: | :----: | - * | **29** | **28** | **9** | **12** | **11** | - * | 21 _-x-_ | | 6.1 _-x-_ | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :------: | :-----: | :-----: | :----: | :----: | + * | **29** | **28** | **9** | **12** | **11** | + * | 21 _-x-_ | | 7 _-x-_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/flex-wrap */ @@ -1737,10 +1678,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :-----: | :----: | :-: | - * | **33** | **32** | **9** | **79** | No | - * | | | 6 _-x-_ | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :-----: | :--: | :-: | + * | **33** | **32** | **9** | n/a | No | + * | | | 6 _-x-_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/font-kerning */ @@ -1754,7 +1695,7 @@ export interface StandardLonghandProperties { * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :--: | :-: | - * | No | **34** | No | No | No | + * | No | **34** | No | n/a | No | * | | 4 _-x-_ | | | | * * @see https://developer.mozilla.org/docs/Web/CSS/font-language-override @@ -1791,17 +1732,31 @@ export interface StandardLonghandProperties { /** * The **`font-size-adjust`** CSS property sets how the font size should be chosen based on the height of lowercase rather than capital letters. * - * **Syntax**: `none | ` + * **Syntax**: `none | [ ex-height | cap-height | ch-width | ic-width | ic-height ]? [ from-font | ]` * * **Initial value**: `none` * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :--: | :-: | - * | n/a | **1** | No | n/a | No | + * | No | **3** | No | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/font-size-adjust */ fontSizeAdjust?: FontSizeAdjustProperty; + /** + * The **`font-smooth`** CSS property controls the application of anti-aliasing when fonts are rendered. + * + * **Syntax**: `auto | never | always | | ` + * + * **Initial value**: `auto` + * + * | Chrome | Firefox | Safari | Edge | IE | + * | :------------------------------: | :--------------------------------: | :------------------------------: | :--: | :-: | + * | **5** _(-webkit-font-smoothing)_ | **25** _(-moz-osx-font-smoothing)_ | **4** _(-webkit-font-smoothing)_ | n/a | No | + * + * @see https://developer.mozilla.org/docs/Web/CSS/font-smooth + */ + fontSmooth?: FontSmoothProperty; /** * The **`font-stretch`** CSS property selects a normal, condensed, or expanded face from a font. * @@ -1833,13 +1788,13 @@ export interface StandardLonghandProperties { /** * The **`font-synthesis`** CSS property controls which missing typefaces, bold or italic, may be synthesized by the browser. * - * **Syntax**: `none | [ weight || style ]` + * **Syntax**: `none | [ weight || style || small-caps ]` * * **Initial value**: `weight style` * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :--: | :-: | - * | No | **34** | **9** | No | No | + * | **97** | **34** | **9** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/font-synthesis */ @@ -1858,6 +1813,20 @@ export interface StandardLonghandProperties { * @see https://developer.mozilla.org/docs/Web/CSS/font-variant */ fontVariant?: FontVariantProperty; + /** + * The **`font-variant-alternates`** CSS property controls the usage of alternate glyphs. These alternate glyphs may be referenced by alternative names defined in `@font-feature-values`. + * + * **Syntax**: `normal | [ stylistic( ) || historical-forms || styleset( # ) || character-variant( # ) || swash( ) || ornaments( ) || annotation( ) ]` + * + * **Initial value**: `normal` + * + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :-----: | :--: | :-: | + * | No | **34** | **9.1** | n/a | No | + * + * @see https://developer.mozilla.org/docs/Web/CSS/font-variant-alternates + */ + fontVariantAlternates?: FontVariantAlternatesProperty; /** * The **`font-variant-caps`** CSS property controls the use of alternate glyphs for capital letters. * @@ -1865,9 +1834,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `normal` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **52** | **34** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :-----: | :--: | :-: | + * | **52** | **34** | **9.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/font-variant-caps */ @@ -1879,9 +1848,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `normal` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **63** | **34** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :-----: | :--: | :-: | + * | **63** | **34** | **9.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/font-variant-east-asian */ @@ -1893,10 +1862,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `normal` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :------: | :-----: | :-----: | :----: | :-: | - * | **34** | **34** | **9.1** | **79** | No | - * | 31 _-x-_ | | 7 _-x-_ | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :------: | :-----: | :-----: | :--: | :-: | + * | **34** | **34** | **9.1** | n/a | No | + * | 31 _-x-_ | | 7 _-x-_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/font-variant-ligatures */ @@ -1908,9 +1877,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `normal` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :-----: | :----: | :-: | - * | **52** | **34** | **9.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :-----: | :--: | :-: | + * | **52** | **34** | **9.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/font-variant-numeric */ @@ -1922,9 +1891,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `normal` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :--: | :-: | - * | No | **34** | No | No | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :-----: | :--: | :-: | + * | No | **34** | **9.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/font-variant-position */ @@ -1957,6 +1926,21 @@ export interface StandardLonghandProperties { * @see https://developer.mozilla.org/docs/Web/CSS/font-weight */ fontWeight?: FontWeightProperty; + /** + * The **`forced-color-adjust`** CSS property allows authors to opt certain elements out of forced colors mode. This then restores the control of those values to CSS. + * + * **Syntax**: `auto | none` + * + * **Initial value**: `auto` + * + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :-----------------------------: | :---------------------------------: | + * | **89** | No | No | **79** | **10** _(-ms-high-contrast-adjust)_ | + * | | | | 12 _(-ms-high-contrast-adjust)_ | | + * + * @see https://developer.mozilla.org/docs/Web/CSS/forced-color-adjust + */ + forcedColorAdjust?: ForcedColorAdjustProperty; /** * The **`grid-auto-columns`** CSS property specifies the size of an implicitly-created grid column track. * @@ -1964,10 +1948,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :---------------------: | :-------------------------: | - * | **57** | **70** | **10.1** | **16** | **10** _(-ms-grid-columns)_ | - * | | | | 12 _(-ms-grid-columns)_ | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :----: | :-------------------------: | + * | **57** | **70** | **10.1** | **16** | **10** _(-ms-grid-columns)_ | * * @see https://developer.mozilla.org/docs/Web/CSS/grid-auto-columns */ @@ -1993,10 +1976,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :------------------: | :----------------------: | - * | **57** | **70** | **10.1** | **16** | **10** _(-ms-grid-rows)_ | - * | | | | 12 _(-ms-grid-rows)_ | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :----: | :----------------------: | + * | **57** | **70** | **10.1** | **16** | **10** _(-ms-grid-rows)_ | * * @see https://developer.mozilla.org/docs/Web/CSS/grid-auto-rows */ @@ -2078,9 +2060,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **57** | **52** | **10.1** | **16** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :----: | :-------------------------: | + * | **57** | **52** | **10.1** | **16** | **10** _(-ms-grid-columns)_ | * * @see https://developer.mozilla.org/docs/Web/CSS/grid-template-columns */ @@ -2092,9 +2074,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **57** | **52** | **10.1** | **16** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :----: | :----------------------: | + * | **57** | **52** | **10.1** | **16** | **10** _(-ms-grid-rows)_ | * * @see https://developer.mozilla.org/docs/Web/CSS/grid-template-rows */ @@ -2108,7 +2090,7 @@ export interface StandardLonghandProperties { * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :--: | :-: | - * | No | No | **10** | No | No | + * | No | No | **10** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/hanging-punctuation */ @@ -2116,7 +2098,7 @@ export interface StandardLonghandProperties { /** * The **`height`** CSS property specifies the height of an element. By default, the property defines the height of the content area. If `box-sizing` is set to `border-box`, however, it instead determines the height of the border area. * - * **Syntax**: `auto | | | min-content | max-content | fit-content()` + * **Syntax**: `auto | | | min-content | max-content | fit-content | fit-content()` * * **Initial value**: `auto` * @@ -2127,6 +2109,20 @@ export interface StandardLonghandProperties { * @see https://developer.mozilla.org/docs/Web/CSS/height */ height?: HeightProperty; + /** + * The **`hyphenate-character`** CSS property sets the character (or string) used at the end of a line before a hyphenation break. + * + * **Syntax**: `auto | ` + * + * **Initial value**: `auto` + * + * | Chrome | Firefox | Safari | Edge | IE | + * | :---------: | :-----: | :-----------: | :--: | :-: | + * | **6** _-x-_ | **98** | **5.1** _-x-_ | n/a | No | + * + * @see https://developer.mozilla.org/docs/Web/CSS/hyphenate-character + */ + hyphenateCharacter?: HyphenateCharacterProperty; /** * The **`hyphens`** CSS property specifies how words should be hyphenated when text wraps across multiple lines. You can prevent hyphenation entirely, use hyphenation in manually-specified points within the text, or let the browser automatically insert hyphens where appropriate. * @@ -2134,10 +2130,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `manual` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :------: | :-----: | :-----------: | :----------: | :----------: | - * | **55** | **43** | **5.1** _-x-_ | **12** _-x-_ | **10** _-x-_ | - * | 13 _-x-_ | 6 _-x-_ | | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :------: | :-----: | :-----------: | :----: | :----------: | + * | **55** | **43** | **5.1** _-x-_ | **79** | **10** _-x-_ | + * | 13 _-x-_ | 6 _-x-_ | | | | * * @see https://developer.mozilla.org/docs/Web/CSS/hyphens */ @@ -2147,11 +2143,11 @@ export interface StandardLonghandProperties { * * **Syntax**: `from-image | | [ ? flip ]` * - * **Initial value**: `0deg` + * **Initial value**: `from-image` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **81** | **26** | **13.1** | **81** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **81** | **26** | **13.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/image-orientation */ @@ -2163,9 +2159,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **13** | **3.6** | **6** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **13** | **3.6** | **6** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/image-rendering */ @@ -2183,9 +2179,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `normal` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :--: | :-: | - * | No | No | **9** | No | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :---------: | :--: | :-: | + * | No | No | **9** _-x-_ | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/initial-letter */ @@ -2197,13 +2193,19 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **57** | **41** | **12.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **57** | **41** | **12.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/inline-size */ inlineSize?: InlineSizeProperty; + /** + * **Syntax**: `auto | none` + * + * **Initial value**: `auto` + */ + inputSecurity?: InputSecurityProperty; /** * The **`inset`** CSS property defines the logical block and inline start and end offsets of an element, which map to physical offsets depending on the element's writing mode, directionality, and text orientation. It corresponds to the `top` and `bottom`, or `right` and `left` properties depending on the values defined for `writing-mode`, `direction`, and `text-orientation`. * @@ -2211,9 +2213,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :--: | :-: | - * | No | **66** | No | No | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **87** | **66** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/inset */ @@ -2225,9 +2227,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :--: | :-: | - * | n/a | **63** | No | n/a | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **87** | **63** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/inset-block */ @@ -2239,9 +2241,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :--: | :-: | - * | n/a | **63** | No | n/a | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **87** | **63** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/inset-block-end */ @@ -2253,9 +2255,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :--: | :-: | - * | n/a | **63** | No | n/a | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **87** | **63** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/inset-block-start */ @@ -2267,9 +2269,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :--: | :-: | - * | n/a | **63** | No | n/a | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **87** | **63** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/inset-inline */ @@ -2281,9 +2283,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :--: | :-: | - * | n/a | **63** | No | n/a | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **87** | **63** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/inset-inline-end */ @@ -2295,9 +2297,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :--: | :-: | - * | n/a | **63** | No | n/a | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **87** | **63** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/inset-inline-start */ @@ -2309,9 +2311,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **41** | **36** | **8** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **41** | **36** | **8** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/isolation */ @@ -2323,24 +2325,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `normal` * - * --- - * - * _Supported in Flex Layout_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :------: | :-----: | :-------: | :----: | :----: | - * | **52** | **20** | **9** | **12** | **11** | - * | 21 _-x-_ | | 6.1 _-x-_ | | | - * - * --- - * - * _Supported in Grid Layout_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **57** | **52** | **10.1** | **16** | No | - * - * --- + * | Chrome | Firefox | Safari | Edge | IE | + * | :------: | :-----: | :-----: | :----: | :----: | + * | **29** | **20** | **9** | **12** | **11** | + * | 21 _-x-_ | | 7 _-x-_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/justify-content */ @@ -2352,24 +2340,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `legacy` * - * --- - * - * _Supported in Flex Layout_ - * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :----: | :----: | * | **52** | **20** | **9** | **12** | **11** | * - * --- - * - * _Supported in Grid Layout_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **57** | **45** | **10.1** | **16** | No | - * - * --- - * * @see https://developer.mozilla.org/docs/Web/CSS/justify-items */ justifyItems?: JustifyItemsProperty; @@ -2380,27 +2354,27 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * --- - * - * _Supported in Flex Layout_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **57** | **45** | **10.1** | **16** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :----: | :----: | + * | **57** | **45** | **10.1** | **16** | **10** | * - * --- + * @see https://developer.mozilla.org/docs/Web/CSS/justify-self + */ + justifySelf?: JustifySelfProperty; + /** + * The **`justify-tracks`** CSS property sets the alignment in the masonry axis for grid containers that have masonry in their inline axis. * - * _Supported in Grid Layout_ + * **Syntax**: `[ normal | | ? [ | left | right ] ]#` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **57** | **45** | **10.1** | **16** | No | + * **Initial value**: `normal` * - * --- + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | No | n/a | No | n/a | No | * - * @see https://developer.mozilla.org/docs/Web/CSS/justify-self + * @see https://developer.mozilla.org/docs/Web/CSS/justify-tracks */ - justifySelf?: JustifySelfProperty; + justifyTracks?: JustifyTracksProperty; /** * The **`left`** CSS property participates in specifying the horizontal position of a _positioned element_. It has no effect on non-positioned elements. * @@ -2436,10 +2410,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :-----: | :-----: | :---------: | :----: | :-----: | - * | **58** | **69** | **3** _-x-_ | **14** | **5.5** | - * | 1 _-x-_ | | | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :-----: | :-----: | :-----: | :----: | :-----: | + * | **58** | **69** | **11** | **14** | **5.5** | + * | 1 _-x-_ | | 3 _-x-_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/line-break */ @@ -2475,7 +2449,7 @@ export interface StandardLonghandProperties { /** * The **`list-style-image`** CSS property sets an image to be used as the list item marker. * - * **Syntax**: ` | none` + * **Syntax**: ` | none` * * **Initial value**: `none` * @@ -2521,9 +2495,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :--: | :-: | - * | n/a | **66** | No | n/a | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **87** | **66** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/margin-block */ @@ -2535,9 +2509,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **69** | **41** | **12.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **87** | **41** | **12.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/margin-block-end */ @@ -2549,9 +2523,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **69** | **41** | **12.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **87** | **41** | **12.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/margin-block-start */ @@ -2577,9 +2551,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :--: | :-: | - * | n/a | **66** | No | n/a | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **87** | **66** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/margin-inline */ @@ -2591,10 +2565,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----------------------: | :-------------------: | :----------------------: | :----: | :-: | - * | **69** | **41** | **12.1** | **79** | No | - * | 2 _(-webkit-margin-end)_ | 3 _(-moz-margin-end)_ | 3 _(-webkit-margin-end)_ | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----------------------: | :-------------------: | :----------------------: | :--: | :-: | + * | **87** | **41** | **12.1** | n/a | No | + * | 2 _(-webkit-margin-end)_ | 3 _(-moz-margin-end)_ | 3 _(-webkit-margin-end)_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/margin-inline-end */ @@ -2606,10 +2580,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :------------------------: | :---------------------: | :------------------------: | :----: | :-: | - * | **69** | **41** | **12.1** | **79** | No | - * | 2 _(-webkit-margin-start)_ | 3 _(-moz-margin-start)_ | 3 _(-webkit-margin-start)_ | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :------------------------: | :---------------------: | :------------------------: | :--: | :-: | + * | **87** | **41** | **12.1** | n/a | No | + * | 2 _(-webkit-margin-start)_ | 3 _(-moz-margin-start)_ | 3 _(-webkit-margin-start)_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/margin-inline-start */ @@ -2670,6 +2644,12 @@ export interface StandardLonghandProperties { * **Syntax**: `[ | ]{1,4}` * * **Initial value**: `0` + * + * | Chrome | Firefox | Safari | Edge | IE | + * | :-------------------------------------: | :-----: | :---------------------------------------: | :--: | :-: | + * | **1** _(-webkit-mask-box-image-outset)_ | No | **3.1** _(-webkit-mask-box-image-outset)_ | n/a | No | + * + * @see https://developer.mozilla.org/docs/Web/CSS/mask-border-outset */ maskBorderOutset?: MaskBorderOutsetProperty; /** @@ -2678,6 +2658,12 @@ export interface StandardLonghandProperties { * **Syntax**: `[ stretch | repeat | round | space ]{1,2}` * * **Initial value**: `stretch` + * + * | Chrome | Firefox | Safari | Edge | IE | + * | :-------------------------------------: | :-----: | :---------------------------------------: | :--: | :-: | + * | **1** _(-webkit-mask-box-image-repeat)_ | No | **3.1** _(-webkit-mask-box-image-repeat)_ | n/a | No | + * + * @see https://developer.mozilla.org/docs/Web/CSS/mask-border-repeat */ maskBorderRepeat?: MaskBorderRepeatProperty; /** @@ -2686,6 +2672,12 @@ export interface StandardLonghandProperties { * **Syntax**: `{1,4} fill?` * * **Initial value**: `0` + * + * | Chrome | Firefox | Safari | Edge | IE | + * | :------------------------------------: | :-----: | :--------------------------------------: | :--: | :-: | + * | **1** _(-webkit-mask-box-image-slice)_ | No | **3.1** _(-webkit-mask-box-image-slice)_ | n/a | No | + * + * @see https://developer.mozilla.org/docs/Web/CSS/mask-border-slice */ maskBorderSlice?: MaskBorderSliceProperty; /** @@ -2694,6 +2686,12 @@ export interface StandardLonghandProperties { * **Syntax**: `none | ` * * **Initial value**: `none` + * + * | Chrome | Firefox | Safari | Edge | IE | + * | :-------------------------------------: | :-----: | :---------------------------------------: | :--: | :-: | + * | **1** _(-webkit-mask-box-image-source)_ | No | **3.1** _(-webkit-mask-box-image-source)_ | n/a | No | + * + * @see https://developer.mozilla.org/docs/Web/CSS/mask-border-source */ maskBorderSource?: MaskBorderSourceProperty; /** @@ -2702,6 +2700,12 @@ export interface StandardLonghandProperties { * **Syntax**: `[ | | auto ]{1,4}` * * **Initial value**: `auto` + * + * | Chrome | Firefox | Safari | Edge | IE | + * | :------------------------------------: | :-----: | :--------------------------------------: | :--: | :-: | + * | **1** _(-webkit-mask-box-image-width)_ | No | **3.1** _(-webkit-mask-box-image-width)_ | n/a | No | + * + * @see https://developer.mozilla.org/docs/Web/CSS/mask-border-width */ maskBorderWidth?: MaskBorderWidthProperty; /** @@ -2711,9 +2715,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `border-box` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :---------: | :-----: | :---------: | :----------: | :-: | - * | **1** _-x-_ | **53** | **4** _-x-_ | **79** _-x-_ | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :---------: | :-----: | :------: | :--: | :-: | + * | **1** _-x-_ | **53** | **15.4** | n/a | No | + * | | | 4 _-x-_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/mask-clip */ @@ -2725,9 +2730,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `add` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :---: | :-: | - * | No | **53** | No | 18-79 | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :---: | :-: | + * | No | **53** | **15.4** | 18-79 | No | * * @see https://developer.mozilla.org/docs/Web/CSS/mask-composite */ @@ -2739,9 +2744,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :---------: | :-----: | :---------: | :----: | :-: | - * | **1** _-x-_ | **53** | **4** _-x-_ | **16** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :---------: | :-----: | :------: | :---: | :-: | + * | **1** _-x-_ | **53** | **15.4** | 16-79 | No | + * | | | 4 _-x-_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/mask-image */ @@ -2753,9 +2759,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `match-source` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :--: | :-: | - * | No | **53** | No | No | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | No | **53** | **15.4** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/mask-mode */ @@ -2767,9 +2773,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `border-box` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :---------: | :-----: | :---------: | :----------: | :-: | - * | **1** _-x-_ | **53** | **4** _-x-_ | **79** _-x-_ | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :---------: | :-----: | :------: | :--: | :-: | + * | **1** _-x-_ | **53** | **15.4** | n/a | No | + * | | | 4 _-x-_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/mask-origin */ @@ -2781,9 +2788,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `center` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :---------: | :-----: | :-----------: | :----: | :-: | - * | **1** _-x-_ | **53** | **3.2** _-x-_ | **18** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :---------: | :-----: | :-------: | :---: | :-: | + * | **1** _-x-_ | **53** | **15.4** | 18-79 | No | + * | | | 3.1 _-x-_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/mask-position */ @@ -2795,9 +2803,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `no-repeat` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :---------: | :-----: | :-----------: | :----: | :-: | - * | **1** _-x-_ | **53** | **3.2** _-x-_ | **18** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :---------: | :-----: | :-------: | :---: | :-: | + * | **1** _-x-_ | **53** | **15.4** | 18-79 | No | + * | | | 3.1 _-x-_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/mask-repeat */ @@ -2809,9 +2818,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :---------: | :-----: | :---------: | :----: | :-: | - * | **4** _-x-_ | **53** | **4** _-x-_ | **18** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :---------: | :-----: | :------: | :---: | :-: | + * | **4** _-x-_ | **53** | **15.4** | 18-79 | No | + * | | | 4 _-x-_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/mask-size */ @@ -2823,23 +2833,65 @@ export interface StandardLonghandProperties { * * **Initial value**: `luminance` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :-----: | :----: | :-: | - * | **24** | **35** | **6.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **24** | **35** | **7** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/mask-type */ maskType?: MaskTypeProperty; + /** + * The **`math-depth`** property describes a notion of _depth_ for each element of a mathematical formula, with respect to the top-level container of that formula. Concretely, this is used to determine the computed value of the font-size property when its specified value is `math`. + * + * **Syntax**: `auto-add | add() | ` + * + * **Initial value**: `0` + * + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | n/a | n/a | No | n/a | No | + * + * @see https://developer.mozilla.org/docs/Web/CSS/math-depth + */ + mathDepth?: MathDepthProperty; + /** + * The `math-shift` property indicates whether superscripts inside MathML formulas should be raised by a normal or compact shift. + * + * **Syntax**: `normal | compact` + * + * **Initial value**: `normal` + * + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | n/a | No | No | n/a | No | + * + * @see https://developer.mozilla.org/docs/Web/CSS/math-shift + */ + mathShift?: MathShiftProperty; + /** + * The `math-style` property indicates whether MathML equations should render with normal or compact height. + * + * **Syntax**: `normal | compact` + * + * **Initial value**: `normal` + * + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | n/a | n/a | **14.1** | n/a | No | + * + * @see https://developer.mozilla.org/docs/Web/CSS/math-style + */ + mathStyle?: MathStyleProperty; /** * The `**max-block-size**` CSS property specifies the maximum size of an element in the direction opposite that of the writing direction as specified by `writing-mode`. That is, if the writing direction is horizontal, then `max-block-size` is equivalent to `max-height`; if the writing direction is vertical, `max-block-size` is the same as `max-width`. * * **Syntax**: `<'max-width'>` * - * **Initial value**: `0` + * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **57** | **41** | **12.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **57** | **41** | **12.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/max-block-size */ @@ -2847,7 +2899,7 @@ export interface StandardLonghandProperties { /** * The **`max-height`** CSS property sets the maximum height of an element. It prevents the used value of the `height` property from becoming larger than the value specified for `max-height`. * - * **Syntax**: `auto | | | min-content | max-content | fit-content()` + * **Syntax**: `none | | min-content | max-content | fit-content | fit-content()` * * **Initial value**: `none` * @@ -2863,12 +2915,12 @@ export interface StandardLonghandProperties { * * **Syntax**: `<'max-width'>` * - * **Initial value**: `0` + * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :--------: | :----: | :-: | - * | **57** | **41** | **12.1** | **79** | No | - * | | | 10.1 _-x-_ | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :--------: | :--: | :-: | + * | **57** | **41** | **12.1** | n/a | No | + * | | | 10.1 _-x-_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/max-inline-size */ @@ -2882,7 +2934,7 @@ export interface StandardLonghandProperties { /** * The **`max-width`** CSS property sets the maximum width of an element. It prevents the used value of the `width` property from becoming larger than the value specified by `max-width`. * - * **Syntax**: `auto | | | min-content | max-content | fit-content()` + * **Syntax**: `none | | min-content | max-content | fit-content | fit-content()` * * **Initial value**: `none` * @@ -2900,9 +2952,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **57** | **41** | **12.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **57** | **41** | **12.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/min-block-size */ @@ -2910,7 +2962,7 @@ export interface StandardLonghandProperties { /** * The **`min-height`** CSS property sets the minimum height of an element. It prevents the used value of the `height` property from becoming smaller than the value specified for `min-height`. * - * **Syntax**: `auto | | | min-content | max-content | fit-content()` + * **Syntax**: `auto | | | min-content | max-content | fit-content | fit-content()` * * **Initial value**: `auto` * @@ -2928,9 +2980,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **57** | **41** | **12.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **57** | **41** | **12.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/min-inline-size */ @@ -2938,7 +2990,7 @@ export interface StandardLonghandProperties { /** * The **`min-width`** CSS property sets the minimum width of an element. It prevents the used value of the `width` property from becoming smaller than the value specified for `min-width`. * - * **Syntax**: `auto | | | min-content | max-content | fit-content()` + * **Syntax**: `auto | | | min-content | max-content | fit-content | fit-content()` * * **Initial value**: `auto` * @@ -2952,13 +3004,13 @@ export interface StandardLonghandProperties { /** * The **`mix-blend-mode`** CSS property sets how an element's content should blend with the content of the element's parent and the element's background. * - * **Syntax**: `` + * **Syntax**: ` | plus-lighter` * * **Initial value**: `normal` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **41** | **32** | **8** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **41** | **32** | **8** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/mix-blend-mode */ @@ -2970,10 +3022,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :--------------------: | :-----: | :----: | :----: | :-: | - * | **55** | **72** | No | **79** | No | - * | 46 _(motion-distance)_ | | | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :--------------------: | :-----: | :----: | :--: | :-: | + * | **55** | **72** | No | n/a | No | + * | 46 _(motion-distance)_ | | | | | * * @see https://developer.mozilla.org/docs/Web/CSS/offset-distance */ @@ -2981,14 +3033,14 @@ export interface StandardLonghandProperties { /** * The **`offset-path`** CSS property specifies a motion path for an element to follow and defines the element's positioning within the parent container or SVG coordinate system. * - * **Syntax**: `none | ray( [ && ? && contain? ] ) | | | [ || ]` + * **Syntax**: `none | ray( [ && && contain? ] ) | | | [ || ]` * * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----------------: | :-----: | :----: | :----: | :-: | - * | **55** | **72** | No | **79** | No | - * | 46 _(motion-path)_ | | | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----------------: | :-----: | :------: | :--: | :-: | + * | **55** | **72** | **15.4** | n/a | No | + * | 46 _(motion-path)_ | | | | | * * @see https://developer.mozilla.org/docs/Web/CSS/offset-path */ @@ -3000,10 +3052,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :--------------------: | :-----: | :----: | :----: | :-: | - * | **56** | **72** | No | **79** | No | - * | 46 _(motion-rotation)_ | | | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :--------------------: | :-----: | :----: | :--: | :-: | + * | **56** | **72** | No | n/a | No | + * | 46 _(motion-rotation)_ | | | | | * * @see https://developer.mozilla.org/docs/Web/CSS/offset-rotate */ @@ -3017,7 +3069,7 @@ export interface StandardLonghandProperties { * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :----: | :-: | - * | **31** | **36** | **10** | **16** | No | + * | **32** | **36** | **10** | **79** | No | * * @see https://developer.mozilla.org/docs/Web/CSS/object-fit */ @@ -3031,7 +3083,7 @@ export interface StandardLonghandProperties { * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :----: | :-: | - * | **31** | **36** | **10** | **16** | No | + * | **32** | **36** | **10** | **79** | No | * * @see https://developer.mozilla.org/docs/Web/CSS/object-position */ @@ -3041,9 +3093,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **79** | **72** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | No | **72** | No | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/offset-anchor */ @@ -3055,10 +3107,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :--------------------: | :-----: | :----: | :----: | :-: | - * | **55** | **72** | No | **79** | No | - * | 46 _(motion-distance)_ | | | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :--------------------: | :-----: | :----: | :--: | :-: | + * | **55** | **72** | No | n/a | No | + * | 46 _(motion-distance)_ | | | | | * * @see https://developer.mozilla.org/docs/Web/CSS/offset-distance */ @@ -3066,14 +3118,14 @@ export interface StandardLonghandProperties { /** * The **`offset-path`** CSS property specifies a motion path for an element to follow and defines the element's positioning within the parent container or SVG coordinate system. * - * **Syntax**: `none | ray( [ && ? && contain? ] ) | | | [ || ]` + * **Syntax**: `none | ray( [ && && contain? ] ) | | | [ || ]` * * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----------------: | :-----: | :----: | :----: | :-: | - * | **55** | **72** | No | **79** | No | - * | 46 _(motion-path)_ | | | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----------------: | :-----: | :------: | :--: | :-: | + * | **55** | **72** | **15.4** | n/a | No | + * | 46 _(motion-path)_ | | | | | * * @see https://developer.mozilla.org/docs/Web/CSS/offset-path */ @@ -3085,10 +3137,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :--------------------: | :-----: | :----: | :----: | :-: | - * | **56** | **72** | No | **79** | No | - * | 46 _(motion-rotation)_ | | | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :--------------------: | :-----: | :----: | :--: | :-: | + * | **56** | **72** | No | n/a | No | + * | 46 _(motion-rotation)_ | | | | | * * @see https://developer.mozilla.org/docs/Web/CSS/offset-rotate */ @@ -3100,10 +3152,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :--------------------: | :-----: | :----: | :----: | :-: | - * | **56** | **72** | No | **79** | No | - * | 46 _(motion-rotation)_ | | | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :--------------------: | :-----: | :----: | :--: | :-: | + * | **56** | **72** | No | n/a | No | + * | 46 _(motion-rotation)_ | | | | | * * @see https://developer.mozilla.org/docs/Web/CSS/offset-rotate */ @@ -3113,7 +3165,7 @@ export interface StandardLonghandProperties { * * **Syntax**: `` * - * **Initial value**: `1.0` + * **Initial value**: `1` * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :----: | :---: | @@ -3212,9 +3264,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **56** | **66** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **56** | **66** | No | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/overflow-anchor */ @@ -3226,7 +3278,7 @@ export interface StandardLonghandProperties { * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :--: | :-: | - * | No | **69** | No | No | No | + * | No | **69** | No | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/overflow-block */ @@ -3240,11 +3292,23 @@ export interface StandardLonghandProperties { * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :--: | :-: | - * | No | **29** | No | No | No | + * | No | **29** | No | n/a | No | * * @see https://developer.mozilla.org/docs/Mozilla/Gecko/Chrome/CSS/overflow-clip-box */ overflowClipBox?: OverflowClipBoxProperty; + /** + * **Syntax**: ` || ` + * + * **Initial value**: `0px` + * + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **90** | No | No | n/a | No | + * + * @see https://developer.mozilla.org/docs/Web/CSS/overflow-clip-margin + */ + overflowClipMargin?: OverflowClipMarginProperty; /** * **Syntax**: `visible | hidden | clip | scroll | auto` * @@ -3252,7 +3316,7 @@ export interface StandardLonghandProperties { * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :--: | :-: | - * | No | **69** | No | No | No | + * | No | **69** | No | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/overflow-inline */ @@ -3266,7 +3330,7 @@ export interface StandardLonghandProperties { * * | Chrome | Firefox | Safari | Edge | IE | * | :-------------: | :---------------: | :-------------: | :--------------: | :-------------------: | - * | **23** | **49** | **6.1** | **18** | **5.5** _(word-wrap)_ | + * | **23** | **49** | **7** | **18** | **5.5** _(word-wrap)_ | * | 1 _(word-wrap)_ | 3.5 _(word-wrap)_ | 1 _(word-wrap)_ | 12 _(word-wrap)_ | | * * @see https://developer.mozilla.org/docs/Web/CSS/overflow-wrap @@ -3295,25 +3359,11 @@ export interface StandardLonghandProperties { * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :----: | :---: | - * | **1** | **1.5** | **3** | **12** | **5** | + * | **1** | **3.5** | **3** | **12** | **5** | * * @see https://developer.mozilla.org/docs/Web/CSS/overflow-y */ overflowY?: OverflowYProperty; - /** - * The **`overscroll-behavior`** CSS property sets what a browser does when reaching the boundary of a scrolling area. It's a shorthand for `overscroll-behavior-x` and `overscroll-behavior-y`. - * - * **Syntax**: `[ contain | none | auto ]{1,2}` - * - * **Initial value**: `auto` - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **63** | **59** | No | **18** | No | - * - * @see https://developer.mozilla.org/docs/Web/CSS/overscroll-behavior - */ - overscrollBehavior?: OverscrollBehaviorProperty; /** * The **`overscroll-behavior-block`** CSS property sets the browser's behavior when the block direction boundary of a scrolling area is reached. * @@ -3321,9 +3371,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **77** | **73** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **77** | **73** | **16** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/overscroll-behavior-block */ @@ -3335,9 +3385,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **77** | **73** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **77** | **73** | **16** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/overscroll-behavior-inline */ @@ -3351,7 +3401,7 @@ export interface StandardLonghandProperties { * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :----: | :-: | - * | **63** | **59** | No | **18** | No | + * | **63** | **59** | **16** | **18** | No | * * @see https://developer.mozilla.org/docs/Web/CSS/overscroll-behavior-x */ @@ -3365,7 +3415,7 @@ export interface StandardLonghandProperties { * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :----: | :-: | - * | **63** | **59** | No | **18** | No | + * | **63** | **59** | **16** | **18** | No | * * @see https://developer.mozilla.org/docs/Web/CSS/overscroll-behavior-y */ @@ -3377,9 +3427,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :--: | :-: | - * | n/a | **66** | No | n/a | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **87** | **66** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/padding-block */ @@ -3391,9 +3441,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **69** | **41** | **12.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **87** | **41** | **12.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/padding-block-end */ @@ -3405,9 +3455,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **69** | **41** | **12.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **87** | **41** | **12.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/padding-block-start */ @@ -3433,9 +3483,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :--: | :-: | - * | n/a | **66** | No | n/a | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **87** | **66** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/padding-inline */ @@ -3447,10 +3497,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :-----------------------: | :--------------------: | :-----------------------: | :----: | :-: | - * | **69** | **41** | **12.1** | **79** | No | - * | 2 _(-webkit-padding-end)_ | 3 _(-moz-padding-end)_ | 3 _(-webkit-padding-end)_ | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :-----------------------: | :--------------------: | :-----------------------: | :--: | :-: | + * | **87** | **41** | **12.1** | n/a | No | + * | 2 _(-webkit-padding-end)_ | 3 _(-moz-padding-end)_ | 3 _(-webkit-padding-end)_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/padding-inline-end */ @@ -3462,10 +3512,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :-------------------------: | :----------------------: | :-------------------------: | :----: | :-: | - * | **69** | **41** | **12.1** | **79** | No | - * | 2 _(-webkit-padding-start)_ | 3 _(-moz-padding-start)_ | 3 _(-webkit-padding-start)_ | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :-------------------------: | :----------------------: | :-------------------------: | :--: | :-: | + * | **87** | **41** | **12.1** | n/a | No | + * | 2 _(-webkit-padding-start)_ | 3 _(-moz-padding-start)_ | 3 _(-webkit-padding-start)_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/padding-inline-start */ @@ -3605,23 +3655,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `normal` * - * --- - * - * _Supported in Flex Layout_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **59** | **45** | **9** | **79** | No | - * - * --- - * - * _Supported in Grid Layout_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **59** | **53** | **11** | **79** | No | - * - * --- + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **59** | **45** | **9** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/place-content */ @@ -3654,6 +3690,21 @@ export interface StandardLonghandProperties { * @see https://developer.mozilla.org/docs/Web/CSS/position */ position?: PositionProperty; + /** + * The **`print-color-adjust`** CSS property sets what, if anything, the user agent may do to optimize the appearance of the element on the output device. By default, the browser is allowed to make any adjustments to the element's appearance it determines to be necessary and prudent given the type and capabilities of the output device. + * + * **Syntax**: `economy | exact` + * + * **Initial value**: `economy` + * + * | Chrome | Firefox | Safari | Edge | IE | + * | :----------: | :-----------------: | :------: | :----------: | :-: | + * | **17** _-x-_ | **97** | **15.4** | **79** _-x-_ | No | + * | | 48 _(color-adjust)_ | 6 _-x-_ | | | + * + * @see https://developer.mozilla.org/docs/Web/CSS/print-color-adjust + */ + printColorAdjust?: PrintColorAdjustProperty; /** * The **`quotes`** CSS property sets how quotation marks appear. * @@ -3675,9 +3726,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **1** | **4** | **3** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **1** | **4** | **3** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/resize */ @@ -3703,9 +3754,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :--: | :-: | - * | No | **72** | No | No | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :-----: | :-----: | :------: | :--: | :-: | + * | **104** | **72** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/rotate */ @@ -3717,24 +3768,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `normal` * - * --- - * - * _Supported in Flex Layout_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :--: | :-: | - * | No | **63** | No | No | No | - * - * --- - * - * _Supported in Grid Layout_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :-----------------: | :-----------------: | :-----------------------: | :----: | :-: | - * | **66** | **61** | **10.1** _(grid-row-gap)_ | **16** | No | - * | 57 _(grid-row-gap)_ | 52 _(grid-row-gap)_ | | | | - * - * --- + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :----: | :-: | + * | **47** | **52** | **10.1** | **16** | No | * * @see https://developer.mozilla.org/docs/Web/CSS/row-gap */ @@ -3748,7 +3784,7 @@ export interface StandardLonghandProperties { * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :--: | :-: | - * | No | **38** | No | No | No | + * | No | **38** | No | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/ruby-align */ @@ -3762,13 +3798,14 @@ export interface StandardLonghandProperties { /** * The `**ruby-position**` CSS property defines the position of a ruby element relatives to its base element. It can be position over the element (`over`), under it (`under`), or between the characters, on their right side (`inter-character`). * - * **Syntax**: `over | under | inter-character` + * **Syntax**: `[ alternate || [ over | under ] ] | inter-character` * - * **Initial value**: `over` + * **Initial value**: `alternate` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :---: | :-: | - * | No | **38** | No | 12-79 | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :-----: | :-----: | :---------: | :---: | :-: | + * | **84** | **38** | **7** _-x-_ | 12-79 | No | + * | 1 _-x-_ | | | | | * * @see https://developer.mozilla.org/docs/Web/CSS/ruby-position */ @@ -3780,9 +3817,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :--: | :-: | - * | No | **72** | No | No | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :-----: | :-----: | :------: | :--: | :-: | + * | **104** | **72** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/scale */ @@ -3794,9 +3831,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **61** | **36** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **61** | **36** | **15.4** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-behavior */ @@ -3808,9 +3845,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :---------------------------: | :----: | :-: | - * | **69** | **68** | **11** _(scroll-snap-margin)_ | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :-----------------------: | :--: | :-: | + * | **69** | **90** | **14.1** | n/a | No | + * | | | 11 _(scroll-snap-margin)_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-margin */ @@ -3822,9 +3860,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **69** | **68** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **69** | **68** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-margin-block */ @@ -3836,9 +3874,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **69** | **68** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **69** | **68** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-margin-block-end */ @@ -3850,9 +3888,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **69** | **68** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **69** | **68** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-margin-block-start */ @@ -3864,9 +3902,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----------------------------------: | :----: | :-: | - * | **69** | **68** | **11** _(scroll-snap-margin-bottom)_ | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------------------------------: | :--: | :-: | + * | **69** | **68** | **14.1** | n/a | No | + * | | | 11 _(scroll-snap-margin-bottom)_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-margin-bottom */ @@ -3878,9 +3917,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :--: | :-: | - * | No | **68** | No | No | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **69** | **68** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-margin-inline */ @@ -3892,9 +3931,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **69** | **68** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **69** | **68** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-margin-inline-end */ @@ -3906,9 +3945,9 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **69** | **68** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **69** | **68** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-margin-inline-start */ @@ -3920,9 +3959,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :--------------------------------: | :----: | :-: | - * | **69** | **68** | **11** _(scroll-snap-margin-left)_ | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----------------------------: | :--: | :-: | + * | **69** | **68** | **14.1** | n/a | No | + * | | | 11 _(scroll-snap-margin-left)_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-margin-left */ @@ -3934,9 +3974,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :---------------------------------: | :----: | :-: | - * | **69** | **68** | **11** _(scroll-snap-margin-right)_ | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :-----------------------------: | :--: | :-: | + * | **69** | **68** | **14.1** | n/a | No | + * | | | 11 _(scroll-snap-margin-right)_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-margin-right */ @@ -3948,9 +3989,10 @@ export interface StandardLonghandProperties { * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :-------------------------------: | :----: | :-: | - * | **69** | **68** | **11** _(scroll-snap-margin-top)_ | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :---------------------------: | :--: | :-: | + * | **69** | **68** | **14.1** | n/a | No | + * | | | 11 _(scroll-snap-margin-top)_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-margin-top */ @@ -3964,9 +4006,9 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **69** | **68** | **11** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **69** | **68** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-padding */ @@ -3980,9 +4022,9 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **69** | **68** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **69** | **68** | **15** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-padding-block */ @@ -3994,9 +4036,9 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **69** | **68** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **69** | **68** | **15** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-padding-block-end */ @@ -4008,9 +4050,9 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **69** | **68** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **69** | **68** | **15** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-padding-block-start */ @@ -4022,9 +4064,9 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **69** | **68** | **11** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **69** | **68** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-padding-bottom */ @@ -4038,9 +4080,9 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **69** | **68** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **69** | **68** | **15** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-padding-inline */ @@ -4052,9 +4094,9 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **69** | **68** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **69** | **68** | **15** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-padding-inline-end */ @@ -4066,9 +4108,9 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **69** | **68** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **69** | **68** | **15** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-padding-inline-start */ @@ -4080,9 +4122,9 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **69** | **68** | **11** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **69** | **68** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-padding-left */ @@ -4094,9 +4136,9 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **69** | **68** | **11** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **69** | **68** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-padding-right */ @@ -4108,9 +4150,9 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **69** | **68** | **11** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **69** | **68** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-padding-top */ @@ -4122,9 +4164,9 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **69** | **68** | **11** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **69** | **68** | **11** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-snap-align */ @@ -4136,9 +4178,10 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :---------------------------: | :----: | :-: | - * | **69** | **68** | **11** _(scroll-snap-margin)_ | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :-----------------------: | :--: | :-: | + * | **69** | 68-90 | **14.1** | n/a | No | + * | | | 11 _(scroll-snap-margin)_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-margin */ @@ -4150,9 +4193,10 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----------------------------------: | :----: | :-: | - * | **69** | **68** | **11** _(scroll-snap-margin-bottom)_ | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------------------------------: | :--: | :-: | + * | **69** | **68** | **14.1** | n/a | No | + * | | | 11 _(scroll-snap-margin-bottom)_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-margin-bottom */ @@ -4164,9 +4208,10 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :--------------------------------: | :----: | :-: | - * | **69** | **68** | **11** _(scroll-snap-margin-left)_ | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----------------------------: | :--: | :-: | + * | **69** | **68** | **14.1** | n/a | No | + * | | | 11 _(scroll-snap-margin-left)_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-margin-left */ @@ -4178,9 +4223,10 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :---------------------------------: | :----: | :-: | - * | **69** | **68** | **11** _(scroll-snap-margin-right)_ | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :-----------------------------: | :--: | :-: | + * | **69** | **68** | **14.1** | n/a | No | + * | | | 11 _(scroll-snap-margin-right)_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-margin-right */ @@ -4192,9 +4238,10 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :-------------------------------: | :----: | :-: | - * | **69** | **68** | **11** _(scroll-snap-margin-top)_ | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :---------------------------: | :--: | :-: | + * | **69** | **68** | **14.1** | n/a | No | + * | | | 11 _(scroll-snap-margin-top)_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-margin-top */ @@ -4206,9 +4253,9 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `normal` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **75** | No | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **75** | **103** | **15** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-snap-stop */ @@ -4220,10 +4267,10 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :-----: | :----------: | :----------: | - * | **69** | 39-68 | **11** | **12** _-x-_ | **10** _-x-_ | - * | | | 9 _-x-_ | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :-----: | :----: | :----------: | + * | **69** | 39-68 | **11** | **79** | **10** _-x-_ | + * | | | 9 _-x-_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/scroll-snap-type */ @@ -4231,17 +4278,31 @@ The scroll-padding properties define offsets for the optimal viewing region of /** * The **`scrollbar-color`** CSS property sets the color of the scrollbar track and thumb. * - * **Syntax**: `auto | dark | light | {2}` + * **Syntax**: `auto | {2}` * * **Initial value**: `auto` * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :--: | :-: | - * | No | **64** | No | No | No | + * | No | **64** | No | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/scrollbar-color */ scrollbarColor?: ScrollbarColorProperty; + /** + * The **`scrollbar-gutter`** CSS property allows authors to reserve space for the scrollbar, preventing unwanted layout changes as the content grows while also avoiding unnecessary visuals when scrolling isn't needed. + * + * **Syntax**: `auto | stable && both-edges?` + * + * **Initial value**: `auto` + * + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **94** | **97** | No | n/a | No | + * + * @see https://developer.mozilla.org/docs/Web/CSS/scrollbar-gutter + */ + scrollbarGutter?: ScrollbarGutterProperty; /** * The `scrollbar-width` property allows the author to set the maximum thickness of an element’s scrollbars when they are shown. * @@ -4251,7 +4312,7 @@ The scroll-padding properties define offsets for the optimal viewing region of * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :--: | :-: | - * | No | **64** | No | No | No | + * | No | **64** | No | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/scrollbar-width */ @@ -4263,9 +4324,9 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `0.0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **37** | **62** | **10.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **37** | **62** | **10.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/shape-image-threshold */ @@ -4277,9 +4338,9 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `0` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------------: | :----: | :-: | - * | **37** | **62** | **10.1** _-x-_ | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **37** | **62** | **10.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/shape-margin */ @@ -4287,13 +4348,13 @@ The scroll-padding properties define offsets for the optimal viewing region of /** * The **`shape-outside`** CSS property defines a shape—which may be non-rectangular—around which adjacent inline content should wrap. By default, inline content wraps around its margin box; `shape-outside` provides a way to customize this wrapping, making it possible to wrap text around complex objects rather than simple boxes. * - * **Syntax**: `none | || | ` + * **Syntax**: `none | [ || ] | ` * * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **37** | **62** | **10.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **37** | **62** | **10.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/shape-outside */ @@ -4305,9 +4366,10 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `8` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :---------: | :-----: | :----: | :-: | - * | **21** | **4** _-x-_ | **6.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **21** | **91** | **7** | n/a | No | + * | | 4 _-x-_ | | | | * * @see https://developer.mozilla.org/docs/Web/CSS/tab-size */ @@ -4349,7 +4411,7 @@ The scroll-padding properties define offsets for the optimal viewing region of * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :----: | :----: | :-----: | - * | **47** | **49** | No | **12** | **5.5** | + * | **47** | **49** | **16** | **12** | **5.5** | * * @see https://developer.mozilla.org/docs/Web/CSS/text-align-last */ @@ -4361,10 +4423,10 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :------------------------: | :-----: | :------------------------------: | :------------------------------------: | :------------------------------------: | - * | **48** | **48** | **5.1** _(-webkit-text-combine)_ | **12** _(-ms-text-combine-horizontal)_ | **11** _(-ms-text-combine-horizontal)_ | - * | 9 _(-webkit-text-combine)_ | | | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :------------------------: | :-----: | :------------------------------: | :---: | :------------------------------------: | + * | **48** | **48** | **5.1** _(-webkit-text-combine)_ | 15-79 | **11** _(-ms-text-combine-horizontal)_ | + * | 9 _(-webkit-text-combine)_ | | | | | * * @see https://developer.mozilla.org/docs/Web/CSS/text-combine-upright */ @@ -4376,10 +4438,10 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `currentcolor` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **57** | **36** | **12.1** | **79** | No | - * | | | 8 _-x-_ | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **57** | **36** | **12.1** | n/a | No | + * | | | 8 _-x-_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/text-decoration-color */ @@ -4391,10 +4453,10 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **57** | **36** | **12.1** | **79** | No | - * | | | 8 _-x-_ | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **57** | **36** | **12.1** | n/a | No | + * | | | 8 _-x-_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/text-decoration-line */ @@ -4408,8 +4470,8 @@ The scroll-padding properties define offsets for the optimal viewing region of * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :------: | :--: | :-: | - * | 57-64 | No | **12.1** | No | No | - * | | | 8 _-x-_ | | | + * | 57-64 | No | **12.1** | n/a | No | + * | | | 7 _-x-_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/text-decoration-skip */ @@ -4421,9 +4483,9 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **64** | **70** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **64** | **70** | **15.4** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/text-decoration-skip-ink */ @@ -4435,10 +4497,10 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `solid` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **57** | **36** | **12.1** | **79** | No | - * | | | 8 _-x-_ | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **57** | **36** | **12.1** | n/a | No | + * | | | 8 _-x-_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/text-decoration-style */ @@ -4452,25 +4514,11 @@ The scroll-padding properties define offsets for the optimal viewing region of * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :------: | :--: | :-: | - * | No | **70** | **12.1** | No | No | + * | **89** | **70** | **12.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/text-decoration-thickness */ textDecorationThickness?: TextDecorationThicknessProperty; - /** - * The **`text-decoration-thickness`** CSS property sets the thickness, or width, of the decoration line that is used on text in an element, such as a line-through, underline, or overline. - * - * **Syntax**: `auto | from-font | | ` - * - * **Initial value**: `auto` - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :--: | :-: | - * | No | **70** | **12.1** | No | No | - * - * @see https://developer.mozilla.org/docs/Web/CSS/text-decoration-thickness - */ - textDecorationWidth?: TextDecorationThicknessProperty; /** * The **`text-emphasis-color`** CSS property sets the color of emphasis marks. This value can also be set using the `text-emphasis` shorthand. * @@ -4478,9 +4526,10 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `currentcolor` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----------: | :-----: | :-----: | :----------: | :-: | - * | **25** _-x-_ | **46** | **6.1** | **79** _-x-_ | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :------: | :-----: | :----: | :--: | :-: | + * | **99** | **46** | **7** | n/a | No | + * | 25 _-x-_ | | | | | * * @see https://developer.mozilla.org/docs/Web/CSS/text-emphasis-color */ @@ -4492,9 +4541,10 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `over right` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----------: | :-----: | :-----: | :----------: | :-: | - * | **25** _-x-_ | **46** | **6.1** | **79** _-x-_ | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :------: | :-----: | :----: | :--: | :-: | + * | **99** | **46** | **7** | n/a | No | + * | 25 _-x-_ | | | | | * * @see https://developer.mozilla.org/docs/Web/CSS/text-emphasis-position */ @@ -4506,9 +4556,10 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----------: | :-----: | :-----: | :----------: | :-: | - * | **25** _-x-_ | **46** | **6.1** | **79** _-x-_ | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :------: | :-----: | :----: | :--: | :-: | + * | **99** | **46** | **7** | n/a | No | + * | 25 _-x-_ | | | | | * * @see https://developer.mozilla.org/docs/Web/CSS/text-emphasis-style */ @@ -4548,10 +4599,10 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `mixed` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :------: | :-----: | :-----------: | :----: | :-: | - * | **48** | **41** | **5.1** _-x-_ | **79** | No | - * | 11 _-x-_ | | | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :------: | :-----: | :-------: | :--: | :-: | + * | **48** | **41** | **14** | n/a | No | + * | 11 _-x-_ | | 5.1 _-x-_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/text-orientation */ @@ -4577,9 +4628,9 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **4** | **1** | **5** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **4** | **1** | **5** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/text-rendering */ @@ -4635,7 +4686,7 @@ The scroll-padding properties define offsets for the optimal viewing region of * * | Chrome | Firefox | Safari | Edge | IE | * | :----: | :-----: | :------: | :--: | :-: | - * | No | **70** | **12.1** | No | No | + * | **87** | **70** | **12.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/text-underline-offset */ @@ -4706,9 +4757,9 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `view-box` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **64** | **55** | **11** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **64** | **55** | **11** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/transform-box */ @@ -4791,7 +4842,7 @@ The scroll-padding properties define offsets for the optimal viewing region of /** * The **`transition-timing-function`** CSS property sets how intermediate values are calculated for CSS properties being affected by a transition effect. * - * **Syntax**: `#` + * **Syntax**: `#` * * **Initial value**: `ease` * @@ -4810,9 +4861,9 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `none` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :--: | :-: | - * | No | **72** | No | No | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :-----: | :-----: | :------: | :--: | :-: | + * | **104** | **72** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/translate */ @@ -4838,10 +4889,10 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :-----: | :-----: | :---------: | :----------: | :----------: | - * | **54** | **69** | **3** _-x-_ | **12** _-x-_ | **10** _-x-_ | - * | 1 _-x-_ | 1 _-x-_ | | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :-----: | :-----: | :---------: | :------: | :----------: | + * | **54** | **69** | **3** _-x-_ | **79** | **10** _-x-_ | + * | 1 _-x-_ | 1 _-x-_ | | 12 _-x-_ | | * * @see https://developer.mozilla.org/docs/Web/CSS/user-select */ @@ -4905,7 +4956,7 @@ The scroll-padding properties define offsets for the optimal viewing region of /** * The **`width`** CSS property sets an element's width. By default it sets the width of the content area, but if `box-sizing` is set to `border-box`, it sets the width of the border area. * - * **Syntax**: `auto | | | min-content | max-content | fit-content()` + * **Syntax**: `auto | | | min-content | max-content | fit-content | fit-content()` * * **Initial value**: `auto` * @@ -4923,9 +4974,9 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `auto` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :-----: | :----: | :-: | - * | **36** | **36** | **9.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :-----: | :--: | :-: | + * | **36** | **36** | **9.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/will-change */ @@ -4947,7 +4998,7 @@ The scroll-padding properties define offsets for the optimal viewing region of /** * The **`word-spacing`** CSS property sets the length of space between words and between tags. * - * **Syntax**: `normal | ` + * **Syntax**: `normal | ` * * **Initial value**: `normal` * @@ -4964,12 +5015,6 @@ The scroll-padding properties define offsets for the optimal viewing region of * **Syntax**: `normal | break-word` * * **Initial value**: `normal` - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-----: | - * | **1** | **3.5** | **2** | **12** | **5.5** | - * - * @see https://developer.mozilla.org/docs/Web/CSS/overflow-wrap */ wordWrap?: WordWrapProperty; /** @@ -4979,10 +5024,10 @@ The scroll-padding properties define offsets for the optimal viewing region of * * **Initial value**: `horizontal-tb` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :-----: | :-----: | :-------: | :----: | :---------: | - * | **48** | **41** | **10.1** | **12** | **9** _-x-_ | - * | 8 _-x-_ | | 5.1 _-x-_ | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :-----: | :-----: | :-------: | :----: | :---: | + * | **48** | **41** | **10.1** | **12** | **9** | + * | 8 _-x-_ | | 5.1 _-x-_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/writing-mode */ @@ -5021,13 +5066,13 @@ export interface StandardShorthandProperties { /** * The `**all**` CSS shorthand property sets all of an element's properties (other than `unicode-bidi` and `direction`) to their initial or inherited values, or to the values specified in another stylesheet origin. * - * **Syntax**: `initial | inherit | unset | revert` + * **Syntax**: `initial | inherit | unset | revert | revert-layer` * * **Initial value**: There is no practical initial value for it. * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :-----: | :----: | :-: | - * | **37** | **27** | **9.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :-----: | :--: | :-: | + * | **37** | **27** | **9.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/all */ @@ -5057,6 +5102,20 @@ export interface StandardShorthandProperties { * @see https://developer.mozilla.org/docs/Web/CSS/background */ background?: BackgroundProperty; + /** + * The **`background-position`** CSS property sets the initial position for each background image. The position is relative to the position layer set by `background-origin`. + * + * **Syntax**: `#` + * + * **Initial value**: `0% 0%` + * + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :----: | :---: | + * | **1** | **1** | **1** | **12** | **4** | + * + * @see https://developer.mozilla.org/docs/Web/CSS/background-position + */ + backgroundPosition?: BackgroundPositionProperty; /** * The **`border`** CSS property sets an element's border. It's a shorthand for `border-width`, `border-style`, and `border-color`. * @@ -5072,11 +5131,11 @@ export interface StandardShorthandProperties { /** * The **`border-block`** CSS property is a shorthand property for setting the individual logical block border property values in a single place in the style sheet. * - * **Syntax**: `<'border-top-width'> || <'border-top-style'> || <'color'>` + * **Syntax**: `<'border-top-width'> || <'border-top-style'> || ` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **69** | **66** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **87** | **66** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/border-block */ @@ -5084,11 +5143,11 @@ export interface StandardShorthandProperties { /** * The **`border-block-end`** CSS property is a shorthand property for setting the individual logical block-end border property values in a single place in the style sheet. * - * **Syntax**: `<'border-top-width'> || <'border-top-style'> || <'color'>` + * **Syntax**: `<'border-top-width'> || <'border-top-style'> || ` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **69** | **41** | **12.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **69** | **41** | **12.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/border-block-end */ @@ -5096,11 +5155,11 @@ export interface StandardShorthandProperties { /** * The **`border-block-start`** CSS property is a shorthand property for setting the individual logical block-start border property values in a single place in the style sheet. * - * **Syntax**: `<'border-top-width'> || <'border-top-style'> || <'color'>` + * **Syntax**: `<'border-top-width'> || <'border-top-style'> || ` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **69** | **41** | **12.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **69** | **41** | **12.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/border-block-start */ @@ -5145,11 +5204,11 @@ export interface StandardShorthandProperties { /** * The **`border-inline`** CSS property is a shorthand property for setting the individual logical inline border property values in a single place in the style sheet. * - * **Syntax**: `<'border-top-width'> || <'border-top-style'> || <'color'>` + * **Syntax**: `<'border-top-width'> || <'border-top-style'> || ` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **69** | **66** | No | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **87** | **66** | **14.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/border-inline */ @@ -5157,11 +5216,11 @@ export interface StandardShorthandProperties { /** * The **`border-inline-end`** CSS property is a shorthand property for setting the individual logical inline-end border property values in a single place in the style sheet. * - * **Syntax**: `<'border-top-width'> || <'border-top-style'> || <'color'>` + * **Syntax**: `<'border-top-width'> || <'border-top-style'> || ` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **69** | **41** | **12.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **69** | **41** | **12.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/border-inline-end */ @@ -5169,11 +5228,11 @@ export interface StandardShorthandProperties { /** * The **`border-inline-start`** CSS property is a shorthand property for setting the individual logical inline-start border property values in a single place in the style sheet. * - * **Syntax**: `<'border-top-width'> || <'border-top-style'> || <'color'>` + * **Syntax**: `<'border-top-width'> || <'border-top-style'> || ` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :------: | :----: | :-: | - * | **69** | **41** | **12.1** | **79** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :--: | :-: | + * | **69** | **41** | **12.1** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/border-inline-start */ @@ -5282,10 +5341,10 @@ export interface StandardShorthandProperties { * * **Syntax**: `none | [ <'flex-grow'> <'flex-shrink'>? || <'flex-basis'> ]` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :------: | :-----: | :-------: | :----: | :------: | - * | **29** | **20** | **9** | **12** | **11** | - * | 21 _-x-_ | | 6.1 _-x-_ | | 10 _-x-_ | + * | Chrome | Firefox | Safari | Edge | IE | + * | :------: | :-----: | :-----: | :----: | :------: | + * | **29** | **20** | **9** | **12** | **11** | + * | 21 _-x-_ | | 7 _-x-_ | | 10 _-x-_ | * * @see https://developer.mozilla.org/docs/Web/CSS/flex */ @@ -5295,10 +5354,10 @@ export interface StandardShorthandProperties { * * **Syntax**: `<'flex-direction'> || <'flex-wrap'>` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :------: | :-----: | :-------: | :----: | :----: | - * | **29** | **28** | **9** | **12** | **11** | - * | 21 _-x-_ | | 6.1 _-x-_ | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :------: | :-----: | :-----: | :----: | :----: | + * | **29** | **28** | **9** | **12** | **11** | + * | 21 _-x-_ | | 7 _-x-_ | | | * * @see https://developer.mozilla.org/docs/Web/CSS/flex-flow */ @@ -5320,32 +5379,9 @@ export interface StandardShorthandProperties { * * **Syntax**: `<'row-gap'> <'column-gap'>?` * - * --- - * - * _Supported in Flex Layout_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :--: | :-: | - * | No | **63** | No | No | No | - * - * --- - * - * _Supported in Grid Layout_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :-------------: | :-------------: | :---------------: | :----: | :-: | - * | **66** | **61** | **12** | **16** | No | - * | 57 _(grid-gap)_ | 52 _(grid-gap)_ | 10.1 _(grid-gap)_ | | | - * - * --- - * - * _Supported in Multi-column Layout_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **66** | **61** | No | **16** | No | - * - * --- + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :------: | :----: | :-: | + * | **57** | **52** | **10.1** | **16** | No | * * @see https://developer.mozilla.org/docs/Web/CSS/gap */ @@ -5445,9 +5481,9 @@ export interface StandardShorthandProperties { * * **Syntax**: `#` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :-----: | :----: | :-: | - * | **1** | **2** | **3.2** | **12** | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :-----: | :---: | :-: | + * | **1** | **2** | **3.1** | 12-79 | No | * * @see https://developer.mozilla.org/docs/Web/CSS/mask */ @@ -5456,6 +5492,12 @@ export interface StandardShorthandProperties { * The **`mask-border`** CSS property lets you create a mask along the edge of an element's border. * * **Syntax**: `<'mask-border-source'> || <'mask-border-slice'> [ / <'mask-border-width'>? [ / <'mask-border-outset'> ]? ]? || <'mask-border-repeat'> || <'mask-border-mode'>` + * + * | Chrome | Firefox | Safari | Edge | IE | + * | :------------------------------: | :-----: | :--------------------------------: | :--: | :-: | + * | **1** _(-webkit-mask-box-image)_ | No | **3.1** _(-webkit-mask-box-image)_ | n/a | No | + * + * @see https://developer.mozilla.org/docs/Web/CSS/mask-border */ maskBorder?: MaskBorderProperty; /** @@ -5463,10 +5505,10 @@ export interface StandardShorthandProperties { * * **Syntax**: `[ <'offset-position'>? [ <'offset-path'> [ <'offset-distance'> || <'offset-rotate'> ]? ]? ]! [ / <'offset-anchor'> ]?` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :-----------: | :-----: | :----: | :----: | :-: | - * | **55** | **72** | No | **79** | No | - * | 46 _(motion)_ | | | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :-----------: | :-----: | :----: | :--: | :-: | + * | **55** | **72** | **16** | n/a | No | + * | 46 _(motion)_ | | | | | * * @see https://developer.mozilla.org/docs/Web/CSS/offset */ @@ -5476,10 +5518,10 @@ export interface StandardShorthandProperties { * * **Syntax**: `[ <'offset-position'>? [ <'offset-path'> [ <'offset-distance'> || <'offset-rotate'> ]? ]? ]! [ / <'offset-anchor'> ]?` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :-----------: | :-----: | :----: | :----: | :-: | - * | **55** | **72** | No | **79** | No | - * | 46 _(motion)_ | | | | | + * | Chrome | Firefox | Safari | Edge | IE | + * | :-----------: | :-----: | :----: | :--: | :-: | + * | **55** | **72** | **16** | n/a | No | + * | 46 _(motion)_ | | | | | * * @see https://developer.mozilla.org/docs/Web/CSS/offset */ @@ -5510,6 +5552,20 @@ export interface StandardShorthandProperties { * @see https://developer.mozilla.org/docs/Web/CSS/overflow */ overflow?: OverflowProperty; + /** + * The **`overscroll-behavior`** CSS property sets what a browser does when reaching the boundary of a scrolling area. It's a shorthand for `overscroll-behavior-x` and `overscroll-behavior-y`. + * + * **Syntax**: `[ contain | none | auto ]{1,2}` + * + * **Initial value**: `auto` + * + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :----: | :-: | + * | **63** | **59** | **16** | **18** | No | + * + * @see https://developer.mozilla.org/docs/Web/CSS/overscroll-behavior + */ + overscrollBehavior?: OverscrollBehaviorProperty; /** * The **`padding`** CSS property sets the padding area on all four sides of an element. It is a shorthand for `padding-top`, `padding-right`, `padding-bottom`, and `padding-left`. * @@ -5527,23 +5583,9 @@ export interface StandardShorthandProperties { * * **Syntax**: `<'align-items'> <'justify-items'>?` * - * --- - * - * _Supported in Flex Layout_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **59** | **45** | **11** | **79** | No | - * - * --- - * - * _Supported in Grid Layout_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **59** | **45** | **11** | **79** | No | - * - * --- + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **59** | **45** | **11** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/place-items */ @@ -5553,23 +5595,9 @@ export interface StandardShorthandProperties { * * **Syntax**: `<'align-self'> <'justify-self'>?` * - * --- - * - * _Supported in Flex Layout_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **59** | **45** | No | **79** | No | - * - * --- - * - * _Supported in Grid Layout_ - * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----: | :-----: | :----: | :----: | :-: | - * | **59** | **45** | No | **79** | No | - * - * --- + * | Chrome | Firefox | Safari | Edge | IE | + * | :----: | :-----: | :----: | :--: | :-: | + * | **59** | **45** | **11** | n/a | No | * * @see https://developer.mozilla.org/docs/Web/CSS/place-self */ @@ -5591,9 +5619,10 @@ export interface StandardShorthandProperties { * * **Syntax**: `<'text-emphasis-style'> || <'text-emphasis-color'>` * - * | Chrome | Firefox | Safari | Edge | IE | - * | :----------: | :-----: | :-----: | :----------: | :-: | - * | **25** _-x-_ | **46** | **6.1** | **79** _-x-_ | No | + * | Chrome | Firefox | Safari | Edge | IE | + * | :------: | :-----: | :----: | :--: | :-: | + * | **99** | **46** | **7** | n/a | No | + * | 25 _-x-_ | | | | | * * @see https://developer.mozilla.org/docs/Web/CSS/text-emphasis */ @@ -5675,7 +5704,7 @@ export interface VendorLonghandProperties { /** * The `**animation-timing-function**` CSS property sets how an animation progresses through the duration of each cycle. * - * **Syntax**: `#` + * **Syntax**: `#` * * **Initial value**: `ease` */ @@ -5696,6 +5725,14 @@ export interface VendorLonghandProperties { * **Initial value**: `visible` */ MozBackfaceVisibility?: BackfaceVisibilityProperty; + /** + * In Mozilla applications like Firefox, the **`-moz-border-bottom-colors`** CSS property sets a list of colors for the bottom border. + * + * **Syntax**: `+ | none` + * + * **Initial value**: `none` + */ + MozBorderBottomColors?: MozBorderBottomColorsProperty; /** * The **`border-inline-end-color`** CSS property defines the color of the logical inline-end border of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation. It corresponds to the `border-top-color`, `border-right-color`, `border-bottom-color`, or `border-left-color` property depending on the values defined for `writing-mode`, `direction`, and `text-orientation`. * @@ -5720,6 +5757,22 @@ export interface VendorLonghandProperties { * **Initial value**: `medium` */ MozBorderEndWidth?: BorderInlineEndWidthProperty; + /** + * In Mozilla applications like Firefox, the **`-moz-border-left-colors`** CSS property sets a list of colors for the left border. + * + * **Syntax**: `+ | none` + * + * **Initial value**: `none` + */ + MozBorderLeftColors?: MozBorderLeftColorsProperty; + /** + * In Mozilla applications like Firefox, the **`-moz-border-right-colors`** CSS property sets a list of colors for the right border. + * + * **Syntax**: `+ | none` + * + * **Initial value**: `none` + */ + MozBorderRightColors?: MozBorderRightColorsProperty; /** * The **`border-inline-start-color`** CSS property defines the color of the logical inline start border of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation. It corresponds to the `border-top-color`, `border-right-color`, `border-bottom-color`, or `border-left-color` property depending on the values defined for `writing-mode`, `direction`, and `text-orientation`. * @@ -5736,6 +5789,14 @@ export interface VendorLonghandProperties { * **Initial value**: `none` */ MozBorderStartStyle?: BorderInlineStartStyleProperty; + /** + * In Mozilla applications like Firefox, the **`-moz-border-top-colors`** CSS property sets a list of colors for the top border. + * + * **Syntax**: `+ | none` + * + * **Initial value**: `none` + */ + MozBorderTopColors?: MozBorderTopColorsProperty; /** * The **`box-sizing`** CSS property defines how the user agent should calculate the total width and height of an element. * @@ -5760,14 +5821,6 @@ export interface VendorLonghandProperties { * **Initial value**: `balance` */ MozColumnFill?: ColumnFillProperty; - /** - * The **`column-gap`** CSS property sets the size of the gap (gutter) between an element's columns. - * - * **Syntax**: `normal | ` - * - * **Initial value**: `normal` - */ - MozColumnGap?: ColumnGapProperty; /** * The **`column-rule-color`** CSS property sets the color of the rule (line) drawn between columns in a multi-column layout. * @@ -5808,14 +5861,6 @@ export interface VendorLonghandProperties { * **Initial value**: `none` */ MozContextProperties?: MozContextPropertiesProperty; - /** - * The non-standard **`-moz-float-edge`** CSS property specifies whether the height and width properties of the element include the margin, border, or padding thickness. - * - * **Syntax**: `border-box | content-box | margin-box | padding-box` - * - * **Initial value**: `content-box` - */ - MozFloatEdge?: MozFloatEdgeProperty; /** * The **`font-feature-settings`** CSS property controls advanced typographic features in OpenType fonts. * @@ -5832,14 +5877,6 @@ export interface VendorLonghandProperties { * **Initial value**: `normal` */ MozFontLanguageOverride?: FontLanguageOverrideProperty; - /** - * The **`-moz-force-broken-image-icon`** extended CSS property can be used to force the broken image icon to be shown even when a broken image has an `alt` attribute. - * - * **Syntax**: `` - * - * **Initial value**: `0` - */ - MozForceBrokenImageIcon?: GlobalsNumber; /** * The **`hyphens`** CSS property specifies how words should be hyphenated when text wraps across multiple lines. You can prevent hyphenation entirely, use hyphenation in manually-specified points within the text, or let the browser automatically insert hyphens where appropriate. * @@ -5881,37 +5918,13 @@ export interface VendorLonghandProperties { */ MozOrient?: MozOrientProperty; /** - * In Mozilla applications, the **`-moz-outline-radius-bottomleft`** CSS property can be used to round the bottom-left corner of an element's `outline`. - * - * **Syntax**: `` - * - * **Initial value**: `0` - */ - MozOutlineRadiusBottomleft?: MozOutlineRadiusBottomleftProperty; - /** - * In Mozilla applications, the **`-moz-outline-radius-bottomright`** CSS property can be used to round the bottom-right corner of an element's `outline`. - * - * **Syntax**: `` - * - * **Initial value**: `0` - */ - MozOutlineRadiusBottomright?: MozOutlineRadiusBottomrightProperty; - /** - * In Mozilla applications, the **`-moz-outline-radius-topleft`** CSS property can be used to round the top-left corner of an element's `outline`. + * The **`font-smooth`** CSS property controls the application of anti-aliasing when fonts are rendered. * - * **Syntax**: `` + * **Syntax**: `auto | never | always | | ` * - * **Initial value**: `0` - */ - MozOutlineRadiusTopleft?: MozOutlineRadiusTopleftProperty; - /** - * In Mozilla applications, the **`-moz-outline-radius-topright`** CSS property can be used to round the top-right corner of an element's `outline`. - * - * **Syntax**: `` - * - * **Initial value**: `0` + * **Initial value**: `auto` */ - MozOutlineRadiusTopright?: MozOutlineRadiusToprightProperty; + MozOsxFontSmoothing?: FontSmoothProperty; /** * The **`padding-inline-end`** CSS property defines the logical inline end padding of an element, which maps to a physical padding depending on the element's writing mode, directionality, and text orientation. It corresponds to the `padding-top`, `padding-right`, `padding-bottom`, or `padding-left` property depending on the values defined for `writing-mode`, `direction`, and `text-orientation`. * @@ -5960,6 +5973,14 @@ export interface VendorLonghandProperties { * **Initial value**: `8` */ MozTabSize?: TabSizeProperty; + /** + * The **`-moz-text-blink`** non-standard Mozilla CSS extension specifies the blink mode. + * + * **Syntax**: `none | blink` + * + * **Initial value**: `none` + */ + MozTextBlink?: MozTextBlinkProperty; /** * The **`text-size-adjust`** CSS property controls the text inflation algorithm used on some smartphones and tablets. Other browsers will ignore this property. * @@ -6011,7 +6032,7 @@ export interface VendorLonghandProperties { /** * The **`transition-timing-function`** CSS property sets how intermediate values are calculated for CSS properties being affected by a transition effect. * - * **Syntax**: `#` + * **Syntax**: `#` * * **Initial value**: `ease` */ @@ -6049,21 +6070,21 @@ export interface VendorLonghandProperties { */ MozWindowDragging?: MozWindowDraggingProperty; /** - * The **`-ms-accelerator`** CSS property is a Microsoft extension that sets or retrieves a string indicating whether the object represents a keyboard shortcut. + * The **`-moz-window-shadow`** CSS property specifies whether a window will have a shadow. It only works on Mac OS X. * - * **Syntax**: `false | true` + * **Syntax**: `default | menu | tooltip | sheet | none` * - * **Initial value**: `false` + * **Initial value**: `default` */ - msAccelerator?: MsAcceleratorProperty; + MozWindowShadow?: MozWindowShadowProperty; /** - * The **`align-self`** CSS property aligns flex items of the current flex line overriding the `align-items` value. If any of the item's cross-axis margin is set to `auto`, then `align-self` is ignored. In Grid layout `align-self` aligns the item inside the grid area. + * The **`-ms-accelerator`** CSS property is a Microsoft extension that sets or retrieves a string indicating whether the object represents a keyboard shortcut. * - * **Syntax**: `auto | normal | stretch | | ? ` + * **Syntax**: `false | true` * - * **Initial value**: `auto` + * **Initial value**: `false` */ - msAlignSelf?: AlignSelfProperty; + msAccelerator?: MsAcceleratorProperty; /** * The **`-ms-block-progression`** CSS property is a Microsoft extension that specifies the block progression and layout orientation. * @@ -6161,21 +6182,21 @@ export interface VendorLonghandProperties { */ msFlowInto?: MsFlowIntoProperty; /** - * The **`grid-auto-columns`** CSS property specifies the size of an implicitly-created grid column track. + * The **`grid-template-columns`** CSS property defines the line names and track sizing functions of the grid columns. * - * **Syntax**: `+` + * **Syntax**: `none | | ` * - * **Initial value**: `auto` + * **Initial value**: `none` */ - msGridColumns?: GridAutoColumnsProperty; + msGridColumns?: MsGridColumnsProperty; /** - * The **`grid-auto-rows`** CSS property specifies the size of an implicitly-created grid row track. + * The **`grid-template-rows`** CSS property defines the line names and track sizing functions of the grid rows. * - * **Syntax**: `+` + * **Syntax**: `none | | ` * - * **Initial value**: `auto` + * **Initial value**: `none` */ - msGridRows?: GridAutoRowsProperty; + msGridRows?: MsGridRowsProperty; /** * The **`-ms-high-contrast-adjust`** CSS property is a Microsoft extension that gets or sets a value indicating whether to override any CSS properties that would have been set in high contrast mode. * @@ -6400,6 +6421,14 @@ export interface VendorLonghandProperties { * **Initial value**: `ThreeDDarkShadow` */ msScrollbarShadowColor?: MsScrollbarShadowColorProperty; + /** + * The **`-ms-scrollbar-track-color`** CSS property is a Microsoft extension that specifies the color of the track element of a scrollbar. + * + * **Syntax**: `` + * + * **Initial value**: `Scrollbar` + */ + msScrollbarTrackColor?: MsScrollbarTrackColorProperty; /** * The **`-ms-text-autospace`** CSS property is a Microsoft extension that specifies the autospacing and narrow space width adjustment of text. * @@ -6483,7 +6512,7 @@ export interface VendorLonghandProperties { /** * The **`transition-timing-function`** CSS property sets how intermediate values are calculated for CSS properties being affected by a transition effect. * - * **Syntax**: `#` + * **Syntax**: `#` * * **Initial value**: `ease` */ @@ -6536,46 +6565,6 @@ export interface VendorLonghandProperties { * **Initial value**: `horizontal-tb` */ msWritingMode?: WritingModeProperty; - /** - * The **`object-fit`** CSS property sets how the content of a replaced element, such as an `` or `