Hi there guys I want to know simple css code for creating the reflection of following heading
Code:<html>
<head>
<h1>Heading</h1>
</head>
</html>
Printable View
Hi there guys I want to know simple css code for creating the reflection of following heading
Code:<html>
<head>
<h1>Heading</h1>
</head>
</html>
There are some CSS3 methods of producing reflections, but there are cross-browser support issues. You can find some fun examples by searching on "css reflection". But overall, I'd be inclined to rely on graphics to produce reflections for a while yet.
By the way, <h1> belongs in the <body>, not <head>. <title> belongs in <head> but that is another story.
Hi friends,
Please try with this code:
.image-block { width:78px; margin:0px 10px; float:left; }
.reflection { position:relative; }
.reflection img {
-webkit-transform: scaleY(-1);
-moz-transform: scaleY(-1);
-ms-transform: scaleY(-1);
-o-transform: scaleY(-1);
transform: scaleY(-1);
filter: flipv; opacity:0.20;
filter: alpha(opacity='20');
}