Skip to content

Instantly share code, notes, and snippets.

@bperel
Last active December 12, 2015 06:29
Show Gist options
  • Save bperel/4729725 to your computer and use it in GitHub Desktop.
Save bperel/4729725 to your computer and use it in GitHub Desktop.
<style>
#forkongithub
a {
background: rgb(255, 0, 0);
color: #fff;
text-decoration: none;
font-family: arial, sans-serif;
text-align: center;
font-weight: bold;
padding: 5px 40px;
font-size: 1rem;
line-height: 2rem;
position: relative;
transition: 0.5s;
}
#forkongithub
a:hover {
background: rgb(221, 0, 33);
color: #fff;
}
#forkongithub
a::before,#forkongithub
a::after {
content: "";
width: 100%;
display: block;
position: absolute;
top: 1px;
left: 0;
height: 1px;
background: #fff;
}
#forkongithub
a::before {
bottom: 1px;
top: auto;
}
@media screen and (min-width:800px) {
#forkongithub {
position: absolute;
display: block;
top: 0;
left: 0;
width: 200px;
overflow: hidden;
height: 200px;
}
#forkongithub
a {
width: 200px;
position: absolute;
top: 60px;
left: -60px;
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.8);
}
}
</style>
<span id="forkongithub"><a
href="https://github.com/codepo8/css-fork-on-github-ribbon">Fork me
on GitHub</a></span>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment