CSS3 Border images
Method of using images for borders
IE | Edge | Firefox | Chrome | Safari | Opera | iOS Safari | Opera Mini | Android Browser | Blackberry Browser | Opera Mobile | Chrome for Android | Firefox for Android | IE Mobile | UC Browser for Android | Samsung Internet | QQ Browser | Baidu Browser |
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
49
See notes:
|
|||||||||||||||||
56
See notes:
|
9.3
See notes:
|
4.4
See notes:
|
|||||||||||||||
14 | 52 | 57
See notes:
|
10
See notes:
|
10.0-10.2
See notes:
|
4.4.3-4.4.4
See notes:
|
4
See notes:
|
|||||||||||
11 | 15 | 53 | 58
See notes:
|
10.1
See notes:
|
44
See notes:
|
10.3
See notes:
|
allo
See notes:
|
56
See notes:
|
10
See notes:
|
37
See notes:
|
57
See notes:
|
52 | 11 | 11.4
See notes:
|
5
See notes:
|
1.2
See notes:
|
7.12
See notes:
|
54 | 59
See notes:
|
TP
See notes:
|
45
See notes:
|
||||||||||||||
55 | 60
See notes:
|
46
See notes:
|
|||||||||||||||
56 | 61
See notes:
|
Notes
Note that both the border-style
and border-width
must be specified (not set to none
or 0) for border-images to work.
-
1
Has a bug where
border-image
incorrectly overridesborder-style
. See test case, WebKit bug, discussion -
2
Partial support refers to not supporting
border-image-repeat: space
-
3
Partial support refers to supporting the shorthand syntax, but not the individual properties (
border-image-source
,border-image-slice
, etc). -
4
Partial support refers to not supporting
border-image-repeat: round