Skip to content

Instantly share code, notes, and snippets.

@fassetar
Forked from thunsaker/git-hub-ribbon-custom.html
Last active August 29, 2015 13:58
Show Gist options
  • Save fassetar/10022501 to your computer and use it in GitHub Desktop.
Save fassetar/10022501 to your computer and use it in GitHub Desktop.
including Supported IE's
<!-- Add to the <head> section -->
<style type="text/css">
.git-ribbon {
background-color: #a00;
overflow: hidden;
position: absolute;
left: -3em;
top: 2.5em;
-moz-transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
-moz-box-shadow: 0 0 1em #888;
-webkit-box-shadow: 0 0 1em #888;
box-shadow: 0 0 1em #888;
z-index: 9999;
}
.git-ribbon a {
border: 1px solid #faa;
color: #fff;
display: block;
font: bold 81.25% 'Helvetiva Neue', Helvetica, Arial, sans-serif;
margin: 0.05em 0 0.075em 0;
padding: 0.5em 3.5em;
text-align: center;
text-decoration: none;
/* shadow */
text-shadow: 0 0 0.5em #444;
}
</style>
<!-- Add to the page on which you would like the ribbon to appear. -->
<div class="git-ribbon">
<a href="http://github.com/GIT_USERNAME" rel="me">Find me on GitHub</a>
</div>
<!--
Credit goes to unindented.org for the ribbon css
http://unindented.org/articles/2009/10/github-ribbon-using-css-transforms/
-->
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment