Skip to content

Instantly share code, notes, and snippets.

Created May 18, 2012 18:35
Show Gist options
  • Save anonymous/2726935 to your computer and use it in GitHub Desktop.
Save anonymous/2726935 to your computer and use it in GitHub Desktop.
The first commented line is your dabblet’s title
/**
* The first commented line is your dabblet’s title
*/
body {background: #fff;}
@-webkit-keyframes rotate {
0% { -webkit-transform: rotate(0deg) }
100% { -webkit-transform: rotate(360deg) }}
.star {
background: rgb(41,115,151);
width: 200px;
height: 200px;
position: absolute;
text-align: center;
top: 100px;
left:33% ;
-webkit-animation: rotate 20s linear infinite;
}
.text {
color: #fff;
position: absolute;
top: 100px;
left: 34%;
width: 200px;
height: 200px;
font-size: 3em;
text-align: center;
z-index: 99;
margin-top: 1em;
-webkit-transform: rotate(-5deg);
text-shadow: rgba(0,0,0,0.75) 2px 1px 2px;
}
.star:before, .star:after {
content: "";
position: absolute;
top: 0;
left: 0;
height: 200px;
width: 200px;
background: rgb(41,115,151);
-webkit-animation: rotate 20s linear infinite;
}
.star:before {
-webkit-transform: rotate(30deg);
-moz-transform: rotate(30deg);
-ms-transform: rotate(30deg);
-o-transform: rotate(30deg);
}
.star:after {
-webkit-transform: rotate(60deg);
-moz-transform: rotate(60deg);
-ms-transform: rotate(60deg);
-o-transform: rotate(60deg);
}
<!-- content to be placed inside <body>…</body> -->
<div class="star"></div>
<div class="text">Buy Me Now!</div>
{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"result"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment