Skip to content

Instantly share code, notes, and snippets.

@holasnic
Created January 20, 2015 00:55
Show Gist options
  • Save holasnic/142b384e8c80de7ea12f to your computer and use it in GitHub Desktop.
Save holasnic/142b384e8c80de7ea12f to your computer and use it in GitHub Desktop.
Uncle Goose Button
.btncontainer {
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
left: 0;
right: 0;
}
.btngoose {
position: relative;
margin: auto;
max-width: 140px;
width: 100%;
left: 0;
right: 0;
top: 0;
padding: 15px 30px;
border: 0;
cursor: pointer;
outline: 0;
font-size: 14px;
font-size: 0.875rem;
font-weight: bold;
color: #fff;
text-transform: uppercase;
text-align: center;
line-height: 1;
transition: top 0.1s, box-shadow 0.1s;
background: #329dad;
box-shadow: 0 0 #2c6970;
letter-spacing: 1.5px;
}
.btngoose:hover {
top: -5px;
color: #fff;
transition: top 0.1s, box-shadow 0.1s;
box-shadow: 0 5px #2c6970;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment