Skip to content

Instantly share code, notes, and snippets.

@mightymess
Created February 20, 2012 15:39
Show Gist options
  • Select an option

  • Save mightymess/1869700 to your computer and use it in GitHub Desktop.

Select an option

Save mightymess/1869700 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
*/
.roundBt{
width:80px;
height:80px;
position:absolute;
left:60px;
top:20px;
border:solid 1px #609eb0;
display:block;
border-radius:40px;
transition: all 0.1s ease-in-out;
background-image: -webkit-linear-gradient(bottom, rgb(218,232,246) 25%, rgb(8,207,220) 100%);
box-shadow: 0 5px 4px #999, inset 0px 0px 10px #78cfdc, inset 0px 0px 10px #78cfdc, inset 0px 6px 1px #fff, inset 0 -4px 5px #8da2af;
}
.roundBt:active{
top:20px;
background-image: -webkit-linear-gradient(top, rgb(218,232,246) 25%, rgb(8,207,220) 100%);
box-shadow: inset 0px 0px 10px #78cfdc, inset 0px 0px 10px #78cfdc, inset 0px 4px 1px #8da2af, inset 0 -4px 5px #fff;
}
<!-- content to be placed inside <body>…</body> -->
<a href="#" class="roundBt"></a>
{"view":"split","prefixfree":"1","page":"css"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment