Webkit CSS Reflections

On April 2008 the webkit.org website posted a really cool feature in the webkit browsers.

CSS Reflections

It allows you to create a image or text reflection with CSS.

Hell, How?

Using:

  • -webkit-box-reflect

You can also add -webkit-gradient This will create a nice gradient in the reflection.

Code

Example

Image

Supported Browsers

Safari and Chrome

Why now June 2010 we can not see it in Firefox 3.6 or IE8?

About Rick

Senior Front-end Software Engineer from Barcelona, Haidong Gumdo Instructor (korean martial art of the sword), street photographer, travel lover, TV addict, Boston Red Sox fan, and privacy advocate.
2 comments

Leave a Reply

Add <code> Some Code </code> by using this tags.

*
*