Doing it with style
A simple method of producing an image reflection on a solid color background.
The previous method used svg masking and browser specific styling which allowed you to reflect an element on any background, but when the background is a solid color this can be done more easily using just CSS.
This works in all the latest browsers except Opera which does not yet support the 3D transforms which is used to flip the reflection. It does, however, show that Opera now recognises the -webkit- prefix and applies the linear background image using the -webkit- specific styles.
Because of all the time and effort spent in producing this demonstration I would ask that you respect my copyright.
Your donations keep CSS PLAY running.
If your donation is for the use of a demo then please email me with the demo url after making your donation.