CSS background-attachment

Method of defining how a background image is attached to a scrollable element. Values include scroll (default), fixed and local.

Spec	https://www.w3.org/TR/css3-background/#the-background-attachment
Status	W3C Candidate Recommendation

IE	Edge	Firefox	Chrome	Safari	Opera
			98
		95	97
		94	96	TP ⁽⁵⁾
11	95	93	95	15 ⁽⁵⁾	80
10	94	92	94	14.1 ⁽⁵⁾	79
9	93	91	93	14 ⁽⁵⁾	78
8 ⁽¹⁾	92	90	92	13.1 ⁽¹⁾	77
Show all
7 ⁽¹⁾	91	89	91	13 ⁽¹⁾	76
6 ⁽¹⁾	90	88	90	12.1	75
5.5 ⁽¹⁾	89	87	89	12	74
	88	86	88	11.1	73
	87	85	87	11	72
	86	84	86	10.1	71
	85	83	85	10	70
	84	82	84	9.1	69
	83	81	83	9	68
	81	80	81	8	67
	80	79	80	7.1	66
	79	78	79	7	65
	18	77	78	6.1	64
	17	76	77	6	63
	16	75	76	5.1	62
	15	74	75	5	60
	14	73	74	4 ⁽¹⁾	58
	13	72	73	3.2 ⁽¹⁾	57
	12	71	72	3.1 ⁽¹⁾	56
		70	71		55
		69	70		54
		68	69		53
		67	68		52
		66	67		51
		65	66		50
		64	65		49
		63	64		48
		62	63		47
		61	62		46
		60	61		45
		59	60		44
		58	59		43
		57	58		42
		56	57		41
		55	56		40
		54	55		39
		53	54		38
		52	53		37
		51	52		36
		50	51		35
		49	50		34
		48	49		33
		47	48		32
		46	47		31
		45	46		30
		44	45		29
		43	44		28
		42	43		27
		41	42		26
		40	41		25
		39	40		24
		38	39		23
		37	38		22
		36	37		21
		35	36		20
		34	35		19
		33	34		18
		32	33		17
		31	32		16
		30	31		15
		29	30		12.1
		28	29		12
		27	28		11.6
		26	27		11.5
		25	26		11.1
		24 ⁽¹⁾	25		11
		23 ⁽¹⁾	24		10.6
		22 ⁽¹⁾	23		10.5
		21 ⁽¹⁾	22		10.0-10.1 ⁽¹⁾
		20 ⁽¹⁾	21		9.5-9.6 ⁽¹⁾
		19 ⁽¹⁾	20		9 ⁽¹⁾
		18 ⁽¹⁾	19
		17 ⁽¹⁾	18
		16 ⁽¹⁾	17
		15 ⁽¹⁾	16
		14 ⁽¹⁾	15
		13 ⁽¹⁾	14
		12 ⁽¹⁾	13
		11 ⁽¹⁾	12
		10 ⁽¹⁾	11
		9 ⁽¹⁾	10
		8 ⁽¹⁾	9
		7 ⁽¹⁾	8
		6 ⁽¹⁾	7
		5 ⁽¹⁾	6
		4 ⁽¹⁾	5
		3.6 ⁽¹⁾	4
		3.5 ⁽¹⁾
		3 ⁽¹⁾
		2 ⁽¹⁾

Notes

Most mobile devices have a delay in updating the background position after scrolling a page with fixed backgrounds.

Partial support refers to supporting fixed but not local
Partial support refers to supporting local but not fixed
Only supports local when -webkit-overflow-scrolling: touch is _not_ used
Does not support fixed, and due to a bug only supports local if a border-radius is set on the element.
Broken support of fixed and local when scrolling an outer scroll container. Related to a bug.

iOS has an issue preventing background-attachment: fixed from being used with background-size: cover - see details
Chrome has an issue that occurs when using the will-change property on a selector which also has background-attachment: fixed defined. It causes the image to get cut off and gain whitespace around it.
Firefox does not appear to support the local value when applied on a textarea element.

Data by caniuse.com
Licensed under the Creative Commons Attribution License v4.0.
https://caniuse.com/background-attachment