CSS property: -webkit-box-reflect
Description
Defines a reflection of a border box.
Reflections will update automatically as the source changes. Specifying a reflection has the effect of creating a stacking context (like opacity, masks, and transforms). The reflection is non-interactive, and as such, it has no effect on hit testing. The reflection has no effect on layout, other than being part of a container’s overflow; it is similar to -webkit-box-shadow in this respect.
Syntax
-webkit-box-reflect: <direction> <offset> <mask-box-image>;
Values
- <direction>
The position of the reflection relative to the border box.
above The reflection appears above the border box. below The reflection appears below the border box. left The reflection appears to the left of the border box. right The reflection appears to the right of the border box. - <offset>
The distance of the reflection from the edge of the border box, in length units or as a percentage.
0 (by default) The default value is 0
- <mask-box-image>
Used to overlay the reflection. If omitted, the reflection has no mask.