Welcome to the third part of the cross-browser compatibility guide.

CSS rules across browsers

CSS 2 and 3 know many style rules which you can use to separate the styling and markup of your website. Unfortunately, not every rule can be recognized in every browser. So again we’ll need some big tables to figure out what to use and when.

At-Rules

Rule	Chrome	Edge	Firefox	Safari	Opera	Description
@charset	2.0	12.0	1.5	4.0	9.0	Specifies the character encoding used in the style sheet
@font-face	9.0	5.0	3.6	5.1	11.1	Web designers do not have to use one of the “web-safe” fonts anymore
@import	1.0	5.5	1.0	1.0	3.5	Allows you to import a style sheet into another style sheet
@keyframes	43.0 4.0 (-webkit-)	10.0	16.0 5.0 (-moz-)	9.0 4.0 (-webkit-)	30.0 15.0 (-webkit-) 12.0 (-o-)	Specifies the animation code
@media	21	9	3.5	4.0	9	Used in media queries to apply different styles for different media types/devices
@page	8	19	15		15	Describes the aspect of layout changes that will be applied when printing the document.
@namespace	9	1	1	1	8	Declares a namespace prefix and associates it with a given namespace name

Values and Units

In many cases, CSS rules need values and/or units. And of course, there are cross-browser issues.

Value/Unit	Chrome	Edge	Firefox	Safari	Opera	Description
attr()	2.0	8.0	1.0	3.1	9.0	Returns the value of an attribute of the selected elements.
calc()	26.0 19.0 (-webkit-)	9.0	16.0 4.0 (-moz-)	7.0 6.0 (-webkit-)	15.0	Performs a calculation to be used as the property value.
conic-gradient()	69.0	79.0	83.0	12.1	56.0	Sets a conic gradient as the background image.
counter()	Yes	Yes	Yes	Yes	Yes	Returns the current value of the named counter, as a string.
cubic-bezier()	4.0	10.0	4.0	3.1	10.5	Defines a Cubic Bezier curve.
hsl()	1.0	9.0	1.0	3.1	9.5	Define colors using the Hue-saturation-lightness model (HSL).
hsla()	1.0	9.0	3.0	3.1	10.0	Define colors using the Hue-saturation-lightness-alpha model (HSLA).
linear-gradient()	26.0 10.0 (-webkit-)	10.0	16.0 3.6 (-moz-)	6.1 5.1 (-webkit-)	12.1 11.1 (-o-)	Sets a linear gradient as the background image.
max()	79.0	79.0	75.0	11.1	66.0	Uses the largest value, from a comma-separated list of values, as the property value.
min()	79.0	79.0	75.0	11.1	66.0	Uses the smallest value, from a comma-separated list of values, as the property value.
radial-gradient()	26.0 10.0 (-webkit-)	10.0	16.0 3.6 (-moz-)	6.1 5.1 (-webkit-)	12.1 11.6 (-o-)	Sets a radial gradient as the background image.
repeating-conic-gradient()	69.0	79.0	83.0	12.1	56.0	Used to repeat conic gradients.
repeating-linear-gradient()	26.0 10.0 (-webkit-)	10.0	16.0 3.6  (-moz-)	6.1 5.1  (-webkit-)	12.1 11.1  (-o-)	Used to repeat linear gradients.
repeating-radial-gradient()	26.0 10.0  (-webkit-)	10.0	16.0 3.6  (-moz-)	6.1 5.1  (-webkit-)	12.1 11.1  (-o-)	Used to repeat radial gradients.
rgb()	1.0	4.0	1.0	1.0	3.5	Define colors using the Red-green-blue (RGB) model.
rgba()	1.0	9.0	3.0	3.1	10.0	Define colors using the Red-green-blue-alpha (RGBA) model.
var()	49.0	15.0	31.0	9.1	36.0	Used to insert the value of a CSS variable.
cm	1.0	3.0	1.0	1.0	3.5	Fixed and a length expressed in any of these will appear as exactly that size.
mm	1.0	3.0	1.0	1.0	3.5	Fixed and a length expressed in any of these will appear as exactly that size.
in	1.0	3.0	1.0	1.0	3.5	Fixed and a length expressed in any of these will appear as exactly that size.
px*	1.0	3.0	1.0	1.0	3.5	Fixed and a length expressed in any of these will appear as exactly that size.
pt	1.0	3.0	1.0	1.0	3.5	Fixed and a length expressed in any of these will appear as exactly that size.
pc	1.0	3.0	1.0	1.0	3.5	Fixed and a length expressed in any of these will appear as exactly that size.
em	1.0	3.0	1.0	1.0	3.5	Specify a length relative to another length property.
ex	1.0	3.0	1.0	1.0	3.5	Specify a length relative to another length property.
ch	27.0	9.0	1.0	7.0	20.0	Specify a length relative to another length property.
rem	4.0	9.0	3.6	4.1	11.6	Specify a length relative to another length property.
vw	20.0	9.0	19.0	6.0	20.0	Specify a length relative to another length property.
vh	20.0	9.0	19.0	6.0	20.0	Specify a length relative to another length property.
vmin	20.0	12.0	19.0	6.0	20.0	Specify a length relative to another length property.
vmax	26.0	16.0	19.0	7.0	20.0	Specify a length relative to another length property.
%	1.0	3.0	1.0	1.0	3.5	Specify a length relative to another length property.
inherit	1.0	8.0	1.0	1.0	4.0	Specifies that a property should inherit its value from its parent element.
initial	1.0	12.0	19.0	1.2	15.0	Used to set a CSS property to its default value.
url()	1.0	4.0	1.0	1.0	3.5	To specify more than one image, separate the URLs with a comma
currentcolor	Yes	Yes	Yes	Yes	Yes	Refers to the value of the color property of an element.

CSS Properties

Properties are the major part of style sheets. Again, not every property can be used across different browsers.

Property	Chrome	Edge	Firefox	Safari	Opera	Description
accent-color	93.0	93.0	92.0	15.4	79.0	Specifies the accent color for user-interface controls
align-content	57.0	16.0	52.0	10.1	44.0	Specifies how flex lines are distributed along the cross axis in a flexbox container.
align-items	57.0	16.0	52.0	10.1	44.0	Specifies the default alignment for items inside a flexbox or grid container.
align-self	57.0	16.0	52.0	10.1	44.0	Specifies the alignment in the block direction for the selected item inside a flexbox or grid container.
all	37.0	79.0	27.0	9.1	24.0	Resets all properties, apart from unicode-bidi and direction, to their initial or inherited value.
animation	43.0 4.0  (-webkit-)	10.0	16.0 5.0  (-moz-)	9.0 4.0  (-webkit-)	30.0 15.0  (-webkit-) 12.0 (-o-)	shorthand property
animation-delay	43.0 4.0  (-webkit-)	10.0	16.0 5.0  (-moz-)	9.0 4.0  (-webkit-)	30.0 15.0  (-webkit-) 12.0 (-o-)	Specifies a delay for the start of an animation.
animation-direction	43.0 4.0  (-webkit-)	10.0	16.0 5.0 (-moz-)	9.0 4.0  (-webkit-)	30.0 15.0  (-webkit-) 12.0 (-o-)	Defines whether an animation should be played forwards, backwards or in alternate cycles.
animation-duration	43.0 3.0  (-webkit-)	10.0	16.0 5.0  (-moz-)	9.0 4.0  (-webkit-)	30.0 15.0  (-webkit-) 12.0 (-o-)	Defines how long an animation should take to complete one cycle.
animation-fill-mode	43.0 4.0  (-webkit-)	10.0	16.0 5.0  (-moz-)	9.0 4.0  (-webkit-)	30.0 15.0  (-webkit-) 12.1 12.0 (-o-)	Specifies a style for the element when the animation is not playing
animation-iteration-count	43.0 4.0  (-webkit-)	10.0	16.0 5.0  (-moz-)	9.0 4.0  (-webkit-)	30.0 15.0  (-webkit-) 12.0 (-o-)	Specifies the number of times an animation should be played.
animation-name	43.0 4.0  (-webkit-)	10.0	16.0 5.0  (-moz-)	9.0 4.0  (-webkit-)	30.0 15.0  (-webkit-) 12.0 (-o-)	Specifies a name for the @keyframes animation.
animation-play-state	43.0 4.0  (-webkit-)	10.0	16.0 5.0  (-moz-)	9.0 4.0  (-webkit-)	30.0 15.0  (-webkit-) 12.0 (-o-)	Specifies whether the animation is running or paused.
animation-timing-function	43.0 4.0  (-webkit-)	10.0	16.0 5.0  (-moz-)	9.0 4.0  (-webkit-)	30.0 15.0  (-webkit-) 12.0 (-o-)	Specifies the speed curve of an animation.
aspect-ratio	88	88	89	15	74	Allows you to define the ratio between width and height of an element.
backdrop-filter	76.0	17.0	70.0*	9.0  (-webkit-)	63.0	Used to apply a graphical effect to the area behind an element.
backface-visibility	36.0 12.0  (-webkit-)	10.0	16.0 10.0  (-moz-)	4.0  (-webkit-)	23.0 15.0  (-webkit-)	Defines whether or not the back face of an element should be visible when facing the user.
background	1.0	4.0	1.0	1.0	3.5	shorthand property
background-attachment	1.0	4.0	1.0	1.0	3.5	Sets whether a background image scrolls with the rest of the page, or is fixed.
background-blend-mode	35.0	79.0	30.0	7.1	22.0	Defines the blending mode of each background layer (color and/or image).
background-clip	4.0	9.0	4.0	3.0	10.5	Defines how far the background (color or image) should extend within an element.
background-color	1.0	4.0	1.0	1.0	3.5	Sets the background color of an element.
background-image	1.0	4.0	1.0	1.0	3.5	Sets one or more background images for an element.
background-origin	4.0	9.0	4.0	3.0	10.5	Specifies the origin position (the background positioning area) of a background image.
background-position	1.0	4.0	1.0	1.0	3.5	Sets the starting position of a background image.
background-position-x	1.0	12.0	49.0	1.0	15.0	Sets the position of a background image on the x-axis.
background-position-y	1.0	12.0	49.0	1.0	15.0	Sets the position of a background image on the y-axis.
background-repeat	1.0	4.0	1.0	1.0	3.5	Sets if/how a background image will be repeated.
background-size	4.0 1.0  (-webkit-)	9.0	4.0 3.6  (-moz-)	4.1 3.0  (-webkit-)	10.5 10.0 (-o-)	Specifies the size of the background images.
block-size	57.0	79.0	41.0	12.1	44.0	Specifies the size of an element in the block direction.
border	1.0	4.0	1.0	1.0	3.5	shorthand property
border-block	87.0	87.0	66.0	14.1	73.0	shorthand property
border-block-color	87.0	87.0	66.0	14.1	73.0	Sets the color of an element’s borders in the block direction.
border-block-end-color	69.0	79.0	41.0	12.1	56.0	Sets the color of an element’s border at the end in the block direction.
border-block-end-style	69.0	79.0	41.0	12.1	56.0	Sets the style of an element’s border at the end in the block direction.
border-block-end-width	69.0	79.0	41.0	12.1	56.0	Sets the width of an element’s border at the end in the block direction.
border-block-start-color	69.0	79.0	41.0	12.1	56.0	Sets the width of an element’s border at the start in the block direction.
border-block-start-style	69.0	79.0	41.0	12.1	56.0	Sets the style of an element’s border at the start in the block direction.
border-block-start-width	69.0	79.0	41.0	12.1	56.0	Sets the width of an element’s border at the start in the block direction.
border-block-style	87.0	87.0	66.0	14.1	73.0	Sets the style of an element’s borders in the block direction.
border-block-width	87.0	87.0	66.0	14.1	73.0	Sets the width of an element’s borders in the block direction.
border-bottom	1.0	4.0	1.0	1.0	3.5	shorthand property
border-bottom-color	1.0	4.0	1.0	1.0	3.5	Sets the color of an element’s bottom border.
border-bottom-left-radius	5.0 4.0  (-webkit-)	9.0	4.0 3.0  (-moz-)	5.0 3.1  (-webkit-)	10.5	Defines the radius of the bottom-left corner.
border-bottom-right-radius	5.0 4.0  (-webkit-)	9.0	4.0 3.0  (-moz-)	5.0 3.1  (-webkit-)	10.5	Defines the radius of the bottom-right corner.
border-bottom-style	1.0	5.5	1.0	1.0	9.2	Sets the style of an element’s bottom border.
border-bottom-width	1.0	4.0	1.0	1.0	3.5	Sets the width of an element’s bottom border.
border-collapse	1.0	5.0	1.0	1.2	4.0	Sets whether table borders should collapse into a single border or be separated as in standard HTML.
border-color	1.0	4.0	1.0	1.0	3.5	Sets the color of an element’s four borders. This property can have from one to four values.
border-end-end-radius	89.0	89.0	66.0	15.0	75.0	Defines the radius of the corner at the end in the block and inline directions.
border-end-start-radius	89.0	89.0	66.0	15.0	75.0	Defines the radius of the corner at the end in the block direction and the start in the inline direction.
border-image	16.0 4.0  (-webkit-)	11.0	15.0 3.5  (-moz-)	6.0 3.1  (-webkit-)	15.0 11.0 (-o-)	Allows you to specify an image to be used as the border around an element.
border-image-outset	15.0	11.0	15.0	6.0	15.0	Specifies the amount by which the border image area extends beyond the border box.
border-image-repeat	15.0	11.0	15.0	6.0	15.0	Specifies whether the border image should be repeated, rounded, spaced or stretched.
border-image-slice	15.0	11.0	15.0	6.0	15.0	specifies how to slice the image specified by border-image-source.
border-image-source	15.0	11.0	15.0	6.0	15.0	Specifies the path to the image to be used as a border (instead of the normal border around an element).
border-image-width	15.0	11.0	15.0	6.0	15.0	Specifies the width of the border image.
border-inline	87.0	87.0	66.0	14.1	73.0	shorthand property
border-inline-color	87.0	87.0	66.0	14.1	73.0	Sets the color of an element’s borders in the inline direction.
border-inline-end-color	69.0	79.0	41.0	12.1	56.0	Sets the color of an element’s border at the end in the inline direction.
border-inline-end-style	69.0	79.0	41.0	12.1	56.0	Sets the style of an element’s border at the end in the inline direction.
border-inline-end-width	69.0	79.0	41.0	12.1	56.0	Sets the width of an element’s border at the end in the inline direction.
border-inline-start-color	69.0	79.0	41.0	12.1	56.0	Sets the color of an element’s border at the start in the inline direction.
border-inline-start-style	69.0	79.0	41.0	12.1	56.0	Sets the style of an element’s border at the start in the inline direction.
border-inline-start-width	69.0	79.0	41.0	12.1	56.0	Sets the width of an element’s border at the start in the inline direction.
border-inline-style	87.0	87.0	66.0	14.1	73.0	Sets the style of an element’s borders in the inline direction.
border-inline-width	87.0	87.0	66.0	14.1	73.0	Sets the width of an element’s borders in the inline direction.
border-left	1.0	4.0	1.0	3.5	1.0	shorthand property
border-left-color	1.0	4.0	1.0	1.0	3.5	Sets the color of an element’s left border.
border-left-style	1.0	5.5	1.0	1.0	9.2	Sets the style of an element’s left border.
border-left-width	1.0	4.0	1.0	1.0	3.5	Sets the width of an element’s left border.
border-radius	5.0 4.0  (-webkit-)	9.0	4.0 3.0  (-moz-)	5.0 3.1  (-webkit-)	10.5	Defines the radius of the element’s corners.
border-right	1.0	4.0	1.0	1.0	3.5	shorthand property
border-right-color	1.0	4.0	1.0	1.0	3.5	Sets the color of an element’s right border.
border-right-style	1.0	4.0	1.0	1.0	3.5	Sets the style of an element’s right border.
border-right-width	1.0	4.0	1.0	1.0	3.5	Sets the width of an element’s right border.
border-spacing	1.0	8.0	1.0	1.0	4.0	Sets the distance between the borders of adjacent cells.
border-start-end-radius	89.0	89.0	66.0	15.0	75.0	Defines the radius of the corner at the start in the block direction and end in the inline direction.
border-start-start-radius	89.0	89.0	66.0	15.0	75.0	Defines the radius of the corner at the end in the block and inline directions.
border-style	1.0	4.0	1.0	1.0	3.5	Sets the style of an element’s four borders. This property can have from one to four values.
border-top	1.0	4.0	1.0	1.0	3.5	Shorthand property sets all the top border properties in one declaration.
border-top-color	1.0	4.0	1.0	1.0	3.5	Sets the color of an element’s top border.
border-top-left-radius	5.0 4.0  (-webkit-)	9.0	4.0 3.0  (-moz-)	5.0 3.1  (-webkit-)	10.5	Defines the radius of the top-left corner.
border-top-right-radius	5.0 4.0  (-webkit-)	9.0	4.0 3.0  (-moz-)	5.0 3.1  (-webkit-)	10.5	Defines the radius of the top-right corner.
border-top-style	1.0	5.5	1.0	1.0	9.2	Sets the style of an element’s top border.
border-top-width	1.0	4.0	1.0	1.0	3.5	Sets the width of an element’s top border.
border-width	1.0	4.0	1.0	1.0	3.5	Sets the width of an element’s four borders. This property can have from one to four values.
bottom	1.0	5.0	1.0	1.0	6.0	Affects the vertical position of a positioned element.
box-decoration-break	22.0  (-webkit-)	79.0	32.0	6.1  (-webkit-)	11.5  (-webkit-)	Specifies how the background, padding, border, border-image, box-shadow, margin, and clip-path of an element is applied when the box for the element is fragmented.
abox-reflect	4.0 (-webkit-)	79.0 (-webkit-)	Not supported	4.0 (-webkit-)	15.0 (-webkit-)	Used to create a reflection of an element.
box-shadow	10.0 4.0  (-webkit-)	9.0	4.0 3.5  (-moz-)	5.1 3.1  (-webkit-)	10.5	Attaches one or more shadows to an element.
box-sizing	10.0 4.0  (-webkit-)	8.0	29.0 2.0  (-moz-)	5.1 3.2  (-webkit-)	9.5	Defines how the width and height of an element are calculated: should they include padding and borders, or not.
break-after	50.0	10.0	65.0	10.0	37.0	Specifies whether or not a page break, column break, or region break should occur after the specified element.
break-before	50.0	10.0	65.0	10.0	37.0	Specifies whether or not a page break, column break, or region break should occur before the specified element.
break-inside	50.0	10.0	65.0	10.0	37.0	Specifies whether or not a page break, column break, or region break should occur inside the specified element.
caption-side	1.0	8.0	1.0	1.0	4.0	Specifies the placement of a table caption.
caret-color	57.0	79.0	53.0	11.1	44.0	Specifies the color of the cursor (caret) in inputs, textareas, or any element that is editable.
clear	1.0	5.0	1.0	1.0	6.0	Controls the flow next to floated elements.
clip	1.0	8.0	1.0	1.0	7.0	Lets you specify a rectangle to clip an absolutely positioned element.
clip-path	55.0 23.0  (-webkit-)	79.0**	54.0	9.1 6.1  (-webkit-)	42.0 15.0  (-webkit-)	Lets you clip an element to a basic shape or to an SVG source.
color	1.0	3.0	1.0	1.0	3.5	Specifies the color of text.
column-count	50.0 4.0  (-webkit-)	10.0	52.0 2.0  (-moz-)	9.0 3.1  (-webkit-)	37.0 15.0  (-webkit-) 11.1	Specifies the number of columns an element should be divided into.
column-fill	50.0	10.0	52.0 13.0 (-moz-)	10.0 7.0 (-webkit-)	37.0	Specifies how to fill columns, balanced or not.
column-gap	50(in Multiple) 66(in Grid) 84(in Flexbox)	10(in Multiple) 16(in Grid) 84(in Flexbox)	52(in Multiple) 61(in Grid) 63(in Flexbox)	10(in Multiple) 12(in Grid) 14.1(in Flexbox)	37(in Multiple) 53(in Grid) 70(in Flexbox)	Specifies the gap between the columns in grid, flexbox or multi-column layout.
column-rule	50.0 4.0  (-webkit-)	10.0	52.0 2.0  (-moz-)	9.0 3.1  (-webkit-)	37.0 15.0  (-webkit-) 11.1	Sets the width, style, and color of the rule between columns.
column-rule-color	50.0 4.0  (-webkit-)	10.0	52.0 2.0  (-moz-)	9.0 3.1  (-webkit-)	37.0 15.0  (-webkit-) 11.1	Specifies the color of the rule between columns.
column-rule-style	50.0 4.0  (-webkit-)	10.0	52.0 2.0  (-moz-)	9.0 3.1  (-webkit-)	37.0 15.0  (-webkit-) 11.1	Specifies the style of the rule between columns. Show demo ❯
column-rule-width	50.0 4.0  (-webkit-)	10.0	52.0 2.0  (-moz-)	9.0 3.1  (-webkit-)	37.0 15.0  (-webkit-) 11.1	Specifies the width of the rule between columns.
column-span	50.0 4.0  (-webkit-)	10.0	52.0 2.0  (-moz-)	9.0 3.1  (-webkit-)	37.0 15.0  (-webkit-) 11.1	Specifies how many columns an element should span across.
column-width	50.0 4.0  (-webkit-)	10.0	52.0 2.0  (-moz-)	9.0 3.1  (-webkit-)	37.0 15.0  (-webkit-) 11.1	Specifies the column width.
columns	50.0 4.0  (-webkit-)	10.0	52.0 2.0  (-moz-)	9.0 3.1  (-webkit-)	37.0 15.0  (-webkit-) 11.1	shorthand property
content	1.0	8.0	1.0	1.0	4.0	Used with the ::before and ::after pseudo-elements, to insert generated content.
counter-increment	4.0	8.0	2.0	3.1	9.6	Increases or decreases the value of one or more CSS counters.
counter-reset	4.0	8.0	2.0	3.1	9.6	Creates or resets one or more CSS counters.
cursor	5.0	5.5	4.0	5.0	9.6	Specifies the mouse cursor to be displayed when pointing over an element.
direction	2.0	5.5	1.0	1.3	9.2	Specifies the text direction/writing direction within a block-level element.
display	4.0	8.0	3.0	3.1	7.0	Specifies the display behavior (the type of rendering box) of an element.
empty-cells	1.0	8.0	1.0	1.2	4.0	Sets whether or not to display borders on empty cells in a table.
filter	53.0 18.0  (-webkit-)	13.0	35.0	9.1 6.0  (-webkit-)	40.0 15.0  (-webkit-)	Defines visual effects (like blur and saturation) to an element (often <img>). Show demo ❯
flex	29.0 21.0  (-webkit-)	11.0 10.0  (-ms-)	28.0 18.0 ( -moz-)	9.0 6.1  (-webkit-)	17.0	shorthand property
flex-basis	29.0 21.0  (-webkit-)	11.0 10.0  (-ms-)	28.0 18.0 ( -moz-)	9.0 6.1  (-webkit-)	17.0	Specifies the initial length of a flexible item.
flex-direction	29.0 21.0  (-webkit-)	11.0 10.0  (-ms-)	28.0 18.0 ( -moz-)	9.0 6.1  (-webkit-)	17.0	Specifies the direction of the flexible items.
flex-flow	29.0 21.0  (-webkit-)	11.0 10.0  (-ms-)	28.0 18.0 ( -moz-)	9.0 6.1  (-webkit-)	17.0	shorthand property
flex-grow	29.0 21.0  (-webkit-)	11.0 10.0  (-ms-)	28.0 18.0 ( -moz-)	9.0 6.1  (-webkit-)	17.0	Specifies how much the item will grow relative to the rest of the flexible items inside the same container.
flex-shrink	29.0 21.0  (-webkit-)	11.0 10.0  (-ms-)	28.0 18.0 ( -moz-)	9.0 6.1  (-webkit-)	17.0	Specifies how the item will shrink relative to the rest of the flexible items inside the same container.
flex-wrap	29.0 21.0  (-webkit-)	11.0 10.0  (-ms-)	28.0 18.0 ( -moz-)	9.0 6.1  (-webkit-)	17.0	Specifies whether the flexible items should wrap or not.
float	1.0	4.0	1.0	1.0	7.0	Specifies whether an element should float to the left, right, or not at all.
font	1.0	4.0	1.0	1.0	3.5	shorthand property
font-family	1.0	4.0	1.0	1.0	3.5	Specifies the font for an element.
font-feature-settings	48.0 16.0  (-webkit-)	10.0	34.0 15.0 (-moz-)	9.1	35.0 15.0 (-webkit-)	Allows control over advanced typographic features in OpenType fonts.
font-kerning	33.0 29.0  (-webkit-)	79.0	34.0	9.1 7.0 (-webkit-)	20.1 16.0 (-webkit-)	Controls the usage of the kerning information stored in a font.
font-size	1.0	5.5	1.0	1.0	7.0	Sets the size of a font.
font-size-adjust	Not supported	Not supported	3.0	Not supported	Not supported	Gives you better control of the font size when the first selected font is not available.
font-stretch	48.0	9.0	9.0	11.0	35.0	Allows you to make text narrower (condensed) or wider (expanded).
font-style	1.0	4.0	1.0	1.0	7.0	Specifies the font style for a text.
font-variant	1.0	4.0	1.0	1.0	3.5	Specifies whether or not a text should be displayed in a small-caps font.
font-variant-caps	52.0	79.0	34.0	Not supported	39.0	Controls the usage of alternate glyphs for capital letters.
font-weight	2.0	4.0	1.0	1.3	3.5	Sets how thick or thin characters in text should be displayed.
gap	66 (in Grid) 84 (in Flexbox) 66 (in Multiple Columns)	16(in Grid) 84(in Flexbox) 16(in Multiple Columns)	61(in Grid) 63(in Flexbox) 61(in Multiple Columns)	12(in Grid) 14.1(in Flexbox) Not supported(in Multiple Columns)	53(in Grid) 70(in Flexbox) 53(in Multiple Columns)	Defines the size of the gap between the rows and between the columns in flexbox, grid or multi-column layout.
grid	57	16	52	10	44	shorthand property
grid-area	57	16	52	10	44	Specifies a grid item’s size and location in a grid layout
grid-auto-columns	57	16	52	10	44	Sets a size for the columns in a grid container.
grid-auto-flow	57	16	52	10	44	Controls how auto-placed items get inserted in the grid.
grid-auto-rows	57	16	52	10	44	Sets a size for the rows in a grid container.
grid-column	57	16	52	10	44	Specifies a grid item’s size and location in a grid layout
grid-column-end	57	16	52	10	44	Defines how many columns an item will span, or on which column-line the item will end
grid-column-gap	57	16	52	10	44	Defines the size of the gap between the columns in a grid layout.
grid-column-start	57	16	52	10	44	Defines on which column-line the item will start.
grid-gap	57	16	52	10	44	Defines the size of the gap between the rows and columns in a grid layout
grid-row	57	16	52	10	44	Specifies a grid item’s size and location in a grid layout
grid-row-end	57	16	52	10	44	Defines how many rows an item will span, or on which row-line the item will end
grid-row-gap	57	16	52	10	44	Defines the size of the gap between the rows in a grid layout.
grid-row-start	57	16	52	10	44	Defines on which row-line the item will start.
grid-template	57	16	52	10	44	shorthand property
grid-template-areas	57	16	52	10	44	Specifies areas within the grid layout
grid-template-columns	57	16	52	10	44	Specifies the number (and the widths) of columns in a grid layout.
grid-template-rows	57	16	52	10	44	Specifies the number (and the heights) of the rows in a grid layout.
hanging-punctuation	Not supported	Not supported	Not supported	10+	Not supported	Specifies whether a punctuation mark may be placed outside the line box at the start or at the end of a full line of text.
height	1.0	4.0	1.0	1.0	7.0	Sets the height of an element.
hyphens	55.0	79.0 10.0 (-ms-)	43.0	5.1 (-webkit-)	44.0	Defines whether hyphenation is allowed to create more soft wrap opportunities within a line of text.
image-rendering	41.0	79.0	65.0	10.0	28.0	Specifies the type of algorithm to be used for image scaling.
inline-size	57.0	79.0	41.0	12.1	44.0	Specifies the size of an element in the inline direction.
inset	87.0	87.0	66.0	14.1	73.0	Sets the distance between an element and the parent element.
inset-block	87.0	87.0	63.0	14.1	73.0	sets the distance between an element and the parent element in the block direction.
inset-block-end	87.0	87.0	63.0	14.1	73.0	Sets the distance between the end of an element and the parent element in the block direction.
inset-block-start	87.0	87.0	63.0	14.1	73.0	Sets the distance between the start of an element and the parent element in the block direction.
inset-inline	87.0	87.0	63.0	14.1	73.0	Sets the distance between an element and the parent element in the inline direction.
inset-inline-end	87.0	87.0	63.0	14.1	73.0	Sets the distance between the end of an element and the parent element in the inline direction.
inset-inline-start	87.0	87.0	63.0	14.1	73.0	Sets the distance between the start of an element and the parent element in the inline direction.
isolation	41.0	79.0	36.0	Yes	30.0	Defines whether an element must create a new stacking content.
justify-content	29.0 21.0  (-webkit-)	11.0	28.0 18.0  (-moz-)	9.0 6.1  (-webkit-)	17.0	Aligns the flexible container’s items when the items do not use all available space on the main-axis (horizontally).
justify-items	57.0	16.0	45.0	10.1	44.0	Set on the grid container to give child elements (grid items) alignment in the inline direction.
justify-self	57.0	16.0	45.0	10.1	44.0	Aligns a grid item within its grid cell in the inline direction.
left	1.0	5.5	1.0	1.0	5.0	Affects the horizontal position of a positioned element.
letter-spacing	1.0	4.0	1.0	1.0	3.5	Increases or decreases the space between characters in a text.
line-height	1.0	4.0	1.0	1.0	7.0	Specifies the height of a line.
list-style	1.0	4.0	1.0	1.0	7.0	shorthand for the following properties
list-style-image	1.0	4.0	1.0	1.0	7.0	Replaces the list-item marker with an image.
list-style-position	1.0	4.0	1.0	1.0	3.5	Specifies the position of the list-item markers (bullet points).
list-style-type	1.0	4.0	1.0	1.0	3.5	Specifies the type of list-item marker in a list.
margin	1.0	6.0	1.0	1.0	3.5	Sets the margins for an element
margin-block	87.0	87.0	66.0	14.1	73.0	Specifies the margin at the start and end in the block direction
margin-block-end	87.0	87.0	41.0	12.1	73.0	Specifies the margin at the end in the block direction.
margin-block-start	87.0	87.0	41.0	12.1	73.0	Specifies the margin at the start in the block direction.
margin-bottom	1.0	6.0	41.0	12.1	3.5	Sets the bottom margin of an element.
margin-inline	87.0	87.0	66.0	14.1	73.0	Specifies the margin at the start and end in the inline direction
margin-inline-end	87.0	87.0	41.0	12.1	73.0	Specifies the margin at the end in the inline direction.
margin-inline-start	69.0	79.0	68.0	14.1	56.0	Specifies the margin at the start in the inline direction.
margin-left	1.0	6.0	1.0	1.0	3.5	Sets the left margin of an element.
margin-right	1.0	6.0	1.0	1.0	3.5	Sets the right margin of an element.
margin-top	1.0	6.0	1.0	1.0	3.5	Sets the top margin of an element.
mask-image	4.0  (-webkit-)	79.0  (-webkit-)	53.0	4.0  (-webkit-)	15.0 (-webkit-)	Specifies an image to be used as a mask layer for an element.
mask-mode	Not supported	Not supported	53.0	Not supported	Not supported	Specifies whether the mask layer image should be treated as a luminance mask or as an alpha mask.
mask-origin	4.0  (-webkit-)	79.0 (-webkit-)	53.0	4.0  (-webkit-)	15.0  (-webkit-)	Specifies the origin position (the mask position area) of a mask layer image.
mask-position	4.0  (-webkit-)	79.0 (-webkit-)	53.0	4.0  (-webkit-)	15.0  (-webkit-)	Sets the starting position of a mask image (relative to the mask position area).
mask-repeat	4.0  (-webkit-)	79.0 (-webkit-)	53.0	4.0  (-webkit-)	15.0  (-webkit-)	Sets if/how a mask image will be repeated.
mask-size	4.0  (-webkit-)	79.0 (-webkit-)	53.0	4.0  (-webkit-)	15.0  (-webkit-)	Specifies the size of the mask layer image.
max-height	1.0	7.0	1.0	2.0.2	7.0	Defines the maximum height of an element.
max-width	1.0	7.0	1.0	2.0.2	7.0	Defines the maximum width of an element.
max-block-size	57.0	79.0	41.0	12.1	44.0	Specifies the maximum size of an element in the block direction.
max-inline-size	57.0	79.0	41.0	12.1	44.0	Specifies the maximum size of an element in the inline direction.
min-block-size	57.0	79.0	41.0	12.1	44.0	Specifies the minimum size of an element in the block direction.
min-inline-size	57.0	79.0	41.0	12.1	44.0	Specifies the minimum size of an element in the inline direction.
min-height	1.0	7.0	3.0	2.0.2	4.0	Defines the minimum height of an element.
min-width	1.0	7.0	1.0	2.0.2	4.0	Defines the minimum width of an element.
mix-blend-mode	41.0	79.0	32.0	8.0	35.0	Specifies how an element’s content should blend with its direct parent background.
object-fit	31.0	16.0	36.0	7.1	19.0	Used to specify how an <img> or <video> should be resized to fit its container.
object-position	31.0	16.0	36.0	10.0	19.0	Used together with object-fit to specify how an <img> or <video> should be positioned with x/y coordinates inside its “own content box”.
offset	55.0	79.0	72.0	16.0	42.0	Used when animating an element along a path
offset-anchor	Not supported	Not supported	72.0	Not supported	Not supported	Sspecifies the point on an element to be fixed along a path defined by the offset-path property.
offset-distance	55.0	79.0	72.0	Not supported	42.0	Sets the distance of an element from the start of the path defined by the offset-path property.
offset-path	55.0	79.0	72.0	15.4	45.0	Creates a path for an animated element to follow.
offset-rotate	56.0	79.0	72.0	Not supported	43.0	Sets the rotation of an animated element moving aling a path.
opacity	4.0	9.0	2.0	3.1	9.0	Sets the opacity level for an element.
order	29.0 21.0  (-webkit-)	11.0	28.0 18.0  (-moz-)	9.0 6.1  (-webkit-)	17.0	Specifies the order of a flexible item relative to the rest of the flexible items inside the same container.
orphans	25.0	8.0	Not supported	3.1	10.0	Specifies the minimum number of lines that must be left at the bottom of a page or column.
outline	1.0	8.0	1.5	1.2	7.0	shorthand property
outline-color	1.0	8.0	1.5	1.2	7.0	Specifies the color of an outline.
outline-offset	4.0	15.0	3.5	3.1	10.5	Adds space between the outline and the edge or border of an element.
outline-style	1.0	8.0	1.5	1.2	7.0	Specifies the style of an outline.
outline-width	1.0	8.0	1.5	1.2	7.0	Specifies the width of an outline.
overflow	1.0	4.0	1.0	1.0	7.0	Specifies what should happen if content overflows an element’s box.
overflow-anchor	56.0	79.0	66.0	Not supported	43.0	Makes it possible to turn off scroll anchoring.
overflow-wrap	23.0	18.0	49.0	6.1	12.1	Specifies whether or not the browser can break lines with long words, if they overflow the container.
overflow-x	4.0	9.0 8.0 (-ms-)	3.5	3.0	9.5	Specifies whether to clip the content, add a scroll bar, or display overflow content of a block-level element, when it overflows at the left and right edges.
overflow-y	4.0	9.0 8.0 (-ms-)	1.5	3.0	9.5	Specifies whether to clip the content, add a scroll bar, or display overflow content of a block-level element, when it overflows at the top and bottom edges.
overscroll-behavior	63.0	18.0 ***	59.0	16.0	50.0	Used to turn off scroll chaining or overscroll affordance on an element when you try to scroll past the scroll boundary.
overscroll-behavior-block	63.0	18.0	59.0	16.0	50.0	Used to turn off scroll chaining or overscroll affordance on an element when you try to scroll past the scroll boundary in the block direction.
overscroll-behavior-inline	63.0	18.0	59.0	16.0	50.0	Used to turn off scroll chaining or overscroll affordance on an element when you try to scroll past the scroll boundary in the inline direction.
overscroll-behavior-x	63.0	18.0 ***	59.0	16.0	50.0	Used to turn off scroll chaining or overscroll affordance on an element when you try to scroll past the scroll boundary in the x-direction.
overscroll-behavior-y	63.0	18.0 ***	59.0	16.0	50.0	Used to turn off scroll chaining or overscroll affordance on an element when you try to scroll past the scroll boundary in y-direction.
padding	1.0	4.0	1.0	1.0	3.5	shorthand property
padding-block	87.0	87.0	66.0	14.1	73.0	The space from its border to its content in the block direction, and it is a shorthand property for the following properties:
padding-block-end	87.0	87.0	41.0	12.1	73.0	The space from its border to its content, at the end in the block direction.
padding-block-start	87.0	87.0	41.0	12.1	73.0	The space from its border to its content, at the start in the block direction.
padding-bottom	1.0	4.0	1.0	1.0	3.5	Sets the bottom padding (space) of an element.
padding-inline	87.0	4.0	66.0	14.1	3.5	The space from its border to its content in the inline direction, and it is a shorthand property for the following properties:
padding-inline-end	87.0	4.0	41.0	12.1	3.5	The space from its border to its content, at the end in the inline direction.
padding-inline-start	87.0	4.0	41.0	12.1	3.5	The space from its border to its content, at the start in the inline direction.
padding-left	1.0	4.0	1.0	1.0	3.5	Sets the left padding (space) of an element.
padding-right	1.0	4.0	1.0	1.0	3.5	Sets the right padding (space) of an element.
padding-top	1.0	4.0	1.0	1.0	3.5	Sets the top padding (space) of an element.
page-break-after	1.0	4.0	1.0	1.2	7.0	Adds a page-break after a specified element.
page-break-before	1.0	4.0	1.0	1.2	7.0	Adds a page-break before a specified element..
page-break-inside	1.0	8.0	19.0	1.3	7.0	Sets whether a page-break should be avoided inside a specified element.
paint-order	35.0	17.0	60.0	8.0	22.0	Specifies the order of how an SVG element or text is painted.
perspective	36.0 12.0 (-webkit-)	10.0	16.0 10.0  (-moz-)	9.0 4.0.3  (-webkit-)	23.0 15.0 (-webkit-)	Used to give a 3D-positioned element some perspective.
perspective-origin	36.0 12.0 (-webkit-)	10.0	16.0 10.0  (-moz-)	9.0 4.0.3  (-webkit-)	23.0 15.0 (-webkit-)	Defines at from which position the user is looking at the 3D-positioned element.
place-content	59.0	79.0	53.0	11.0	46.0	Used in flexbox and grid layouts, and is a shorthand property for the following properties:
place-items	59.0	79.0	45.0	11.0	46.0	Used in grid layout, and is a shorthand property for the following properties:
place-self	59.0	79.0	45.0	11.0	46.0	Used to align individual grid items, and is a shorthand property for the following properties:
pointer-events	2.0	11.0	3.6	4.0	9.0	Defines whether or not an element reacts to pointer events.
property	1.0	7.0	1.0	1.0	4.0	Specifies the type of positioning method used for an element (static, relative, absolute, fixed, or sticky).
quotes	11.0	8.0	1.5	5.1	4.0	Sets the type of quotation marks for quotations.
resize	4.0	79.0	5.0 4.0  (-moz-)	4.0	15.0	Defines if (and how) an element is resizable by the user.
right	1.0	5.5	1.0	1.0	5.0	Affects the horizontal position of a positioned element.
rotate	104	104	72	14.1	90	Allows you to rotate elements.
row-gap	66(in Grid) 84(in Flexbox)	16(in Grid) 84(in Flexbox)	61(in Grid) 63(in Flexbox)	12(in Grid) 14.1(in Flexbox)	53(in Grid) 70(in Flexbox)	Specifies the gap between the rows in a flexbox or grid layout.
scale	104	104	72	14.1	90	Allows you to change the size of elements.
scroll-behavior	61.0	79.0	36.0	14.0	48.0	Specifies whether to smoothly animate the scroll position, instead of a straight jump, when the user clicks on a link within a scrollable box.
scroll-margin	69.0	79.0	90.0	14.1	56.0	Specifies the distance between the snap position and the container.
scroll-margin-block	69.0	79.0	68.0	14.1	56.0	Specifies the distance in block direction, between the snap position and the container.
scroll-margin-block-end	69.0	79.0	68.0	14.1	56.0	Specifies the distance in block direction, between the snap position and the container.
scroll-margin-block-start	69.0	79.0	68.0	14.1	56.0	Specifies the distance in block direction, between the snap position and the container .
scroll-margin-bottom	69.0	79.0	68.0	14.1	56.0	Specifies the distance between the snap position and the container.
scroll-margin-inline	69.0	79.0	68.0	14.1	56.0	Specifies the distance in the inline direction, between the snap position and the container.
croll-margin-inline-end	69.0	79.0	68.0	14.1	56.0	Specifies the distance in the inline direction, between the snap position and the container.
scroll-margin-inline-start	69.0	79.0	68.0	14.1	56.0	Specifies the distance in the inline direction, between the snap position and the container.
scroll-margin-left	69.0	79.0	68.0	14.1	56.0	Specifies the distance between the snap position and the container.
scroll-margin-right	69.0	79.0	68.0	14.1	56.0	Specifies the distance between the snap position and the container.
scroll-margin-top	69.0	79.0	68.0	14.1	56.0	Specifies the distance between the snap position and the container.
scroll-padding	69.0	79.0	68.0	14.1	56.0	Specifies the distance from the container to the snap position of child elements.
scroll-padding-block	69.0	79.0	68.0	15.0	56.0	Specifies the distance in block direction, from the container to the snap position on the child elements.
scroll-padding-block-end	69.0	79.0	68.0	15.0	56.0	Specifies the distance in block direction from the end of the container to the snap position on the child elements.
scroll-padding-block-start	69.0	79.0	68.0	15.0	56.0	Specifies the distance in block direction from the start of the container to the snap position on the child elements.
scroll-padding-bottom	69.0	79.0	68.0	14.1	56.0	Specifies the distance from the bottom of the container to the snap position on the child elements.
scroll-padding-inline	69.0	79.0	68.0	15.0	56.0	Specifies the distance in the inline direction from the container to the snap position on the child elements.
scroll-padding-inline-end	69.0	79.0	68.0	15.0	56.0	Specifies the distance in the inline direction from the end of the container to the snap position on the child elements.
scroll-padding-inline-start	69.0	79.0	68.0	15.0	56.0	Specifies the distance in the inline direction from the start of the container to the snap position on the child elements.
scroll-padding-left	69.0	79.0	68.0	14.1	56.0	Specifies the distance from the left side of the container to the snap position on the child elements.
scroll-padding-right	69.0	79.0	68.0	14.1	56.0	Specifies the distance from the right side of the container to the snap position on the child elements.
scroll-padding-top	69.0	79.0	68.0	14.1	56.0	Specifies the distance from the top of the container to the snap position on the child elements.
scroll-snap-align	69.0	79.0	68.0	11.0	56.0	Specifies where elements will snap into focus when you stop scrolling.
scroll-snap-stop	75.0	79.0	103.0	15.0	62.0	Specifies whether to scroll past elements or to stop and snap on the next element.
scroll-snap-type	69.0	79.0	99.0	11.0	56.0	Specifies how the elements will snap into focus when you stop scrolling, and in what direction.
tab-size	21.0	79.0	4.0 (-moz-)	6.1	15.0 10.6 (-o-)	Specifies the width of a tab character.
table-layout	14.0	5.0	1.0	1.0	7.0	Defines the algorithm used to lay out table cells, rows, and columns.
text-align	1.0	3.0	1.0	1.0	3.5	Specifies the horizontal alignment of text in an element.
text-align-last	47.0	5.5****	49.0 12.0  (-moz-)	Not supported	34.0	Specifies how to align the last line of a text.
text-decoration	1.0	3.0	1.0	1.0	3.5	Specifies the decoration added to text
text-decoration-color	57.0	79.0	36.0 6.0 (-moz-)	12.1 7.1 (-webkit-)	44.0	Specifies the color of the text-decoration (underlines, overlines, linethroughs).
text-decoration-line	57.0	79.0	36.0 6.0 (-moz-)	12.1 7.1 (-webkit-)	44.0	Sets the kind of text decoration to use (like underline, overline, line-through).
text-decoration-style	57.0	79.0	36.0 6.0 (-moz-)	12.1	44.0	Sets the style of the text decoration (like solid, wavy, dotted, dashed, double).
text-decoration-thickness	89.0	89.0	70.0	12.1	75.0	Specifies the thickness of the decoration line.
text-emphasis	99.0	99.0	46.0	7.0	15.0 (-webkit-)	Used to apply emphasis marks to text.
text-indent	1.0	3.0	1.0	1.0	3.5	Specifies the indentation of the first line in a text-block.
text-justify	Yes*****	11.0	55.0	10.0.3	Yes*****	Specifies the justification method of text when text-align is set to “justify”.
text-orientation	48.0	79.0	41.0	14.0	35.0	Specifies the orientation of characters.
text-overflow	4.0	6.0	7.0	3.1	11.0 9.0 (-o-)	Specifies how overflowed content that is not displayed should be signaled to the user.
text-shadow	4.0	10.0	3.5	4.0	9.6	Adds shadow to text.
text-transform	1.0	4.0	1.0	1.0	7.0	Controls the capitalization of text.
top	1.0	5.0	1.0	1.0	6.0	Affects the vertical position of a positioned element.
transform(2D)	36.0 4.0  (-webkit-)	10.0 9.0 (-ms-)	16.0 3.5  (-moz-)	9.0 3.2  (-webkit-)	23.0 15.0  (-webkit-) 10.5 (-o-)	Applies a 2D or 3D transformation to an element.
transform(3D)	36.0 12.0  (-webkit-)	12.0	10.0	9.0 4.0  (-webkit-)	23.0 15.0  (-webkit-)	Applies a 2D or 3D transformation to an element.
transform-origin	36.0 4.0  (-webkit-)	10.0 9.0 (-ms-)	16.0 3.5  (-moz-)	9.0 3.2  (-webkit-)	23.0 15.0  (-webkit-) 10.5 (-o-)	Allows you to change the position of transformed elements.
transform-style	36.0 12.0  (-webkit-)	11.0	16.0 10.0  (-moz-)	9.0 4.0  (-webkit-)	23.0 15.0  (-webkit-)	Specifies how nested elements are rendered in 3D space.
transition	26.0 4.0  (-webkit-)	10.0	16.0 4.0  (-moz-)	6.1 3.1  (-webkit-)	12.1 10.5 (-o-)	shorthand property
transition-delay	26.0 4.0  (-webkit-)	10.0	16.0 4.0  (-moz-)	6.1 3.1  (-webkit-)	12.1 10.5 (-o-)	Specifies when the transition effect will start.
transition-duration	26.0 4.0  (-webkit-)	10.0	16.0 4.0  (-moz-)	6.1 3.1  (-webkit-)	12.1 10.5 (-o-)	Specifies how many seconds (s) or milliseconds (ms) a transition effect takes to complete.
transition-property	26.0 4.0  (-webkit-)	10.0	16.0 4.0  (-moz-)	6.1 3.1  (-webkit-)	12.1 10.5 (-o-)	Specifies the name of the CSS property the transition effect is for (the transition effect will start when the specified CSS property changes).
transition-timing-function	26.0 4.0  (-webkit-)	10.0	16.0 4.0  (-moz-)	6.1 3.1  (-webkit-)	12.1 10.5 (-o-)	Specifies the speed curve of the transition effect.
translate	104	104	72	14.1	90	Allows you to change the position of elements.
unicode-bidi	2.0	5.5	1.0	1.3	9.2	Used together with the direction property to set or return whether the text should be overridden to support multiple languages in the same document.
user-select	54.0 6.0  (-webkit-)	79.0 10.0 (-ms-)	69.0 2.0 (-moz-)	3.1 (-webkit-)	41.0 15.0 (-webkit-)	Specifies whether the text of an element can be selected.
vertical-align	1.0	4.0	1.0	1.0	4.0	Sets the vertical alignment of an element.
visibility	1.0	4.0	1.0	1.0	4.0	Specifies whether or not an element is visible.
white-space	1.0	8.0	3.5	3.0	9.5	Specifies how white-space inside an element is handled.
width	1.0	4.0	1.0	1.0	3.5	Sets the width of an element.
word-break	4.0	5.5	15.0	3.1	15.0	Specifies how words should break when reaching the end of a line.
word-spacing	1.0	6.0	1.0	1.0	3.5	Increases or decreases the white space between words.
word-wrap	4.0	5.5	3.5	3.1	10.5	Allows long words to be able to be broken and wrap onto the next line.
writing-mode	48.0	12.0	41.0	11.0	35.0	Specifies whether lines of text are laid out horizontally or vertically.
z-index	1.0	4.0	3.0	1.0	4.0	Specifies the stack order of an element.

* To get this to work, open about:config and set thelayout.css.backdrop-filter.enabled to true, and also the gfx.webrender.all preferences needs to be set to true.

**Before version 79, Edge only supported clip-path on SVG elements (not HTML elements).

*** In Microsoft Edge, the property value ‘none’ is treated like ‘contain’, and this is not correct.

****In Internet Explorer 11 (and earlier), the “start” and “end” values are not supported.

*****This feature is behind the Enable Experimental Web Platform Features preference (needs to be set to Enabled). To change preferences in Chrome: type in “chrome://flags” in the Chrome browser. To change preferences in Opera: type in “flags” in the Opera browser.

As you can see CSS is far from being cross-browser compatible. You need to be careful which selectors, units, and properties you use.

Source:https://www.w3schools.com