Skip to content

Instantly share code, notes, and snippets.

@gertig
Created January 19, 2011 23:27
Show Gist options
  • Save gertig/787103 to your computer and use it in GitHub Desktop.
Save gertig/787103 to your computer and use it in GitHub Desktop.
/*Opacity*/
filter: alpha(opacity=80); /* internet explorer */
-khtml-opacity: 0.8; /* khtml, old safari */
-moz-opacity: 0.8; /* mozilla, netscape */
opacity: 0.8; /* fx, safari, opera */
/*Rounded Corners*/
-moz-border-radius: 10px; /* Firefox */
-webkit-border-radius: 10px; /* Safari, Chrome */
border-radius: 10px; /* CSS3 */
/*How I Implement it*/
.rounded {
-moz-border-radius: 10px; /* Firefox */
-webkit-border-radius: 10px; /* Safari, Chrome */
border-radius: 10px; /* CSS3 */
}
.opacity {
filter: alpha(opacity=80); /* internet explorer */
-khtml-opacity: 0.8; /* khtml, old safari */
-moz-opacity: 0.8; /* mozilla, netscape */
opacity: 0.8; /* fx, safari, opera */
}
/*-------Corner Variations--------*/
.rounded-top {
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.rounded-bottom{
-webkit-border-bottom-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-bottomright: 5px;
-moz-border-radius-bottomleft: 5px;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
}
.rounded-left{
-webkit-border-top-left-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-bottomleft: 5px;
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
.rounded-right{
-webkit-border-top-right-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
-moz-border-radius-topright: 5px;
-moz-border-radius-bottomright: 5px;
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
}
.rounded-top-right{
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topright: 5px;
border-top-right-radius: 5px;
}
.rounded-top-left{
-webkit-border-top-left-radius: 5px;
-moz-border-radius-topleft: 5px;
border-top-left-radius: 5px;
}
.rounded-bottom-right{
-webkit-border-bottom-right-radius: 5px;
-moz-border-radius-bottomright: 5px;
border-bottom-right-radius: 5px;
}
.rounded-bottom-left{
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-bottomleft: 5px;
border-bottom-left-radius: 5px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment