Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

Merge pull request #2 from jankeromnes/master

Added `display:block` on .ribbon
  • Loading branch information...
commit fb42aa83df9b66b02fe1d3ea2dd423904fda4523 2 parents e2bc240 + a5560f1
@jbalogh authored
Showing with 31 additions and 25 deletions.
  1. +31 −25 ribbon.css
View
56 ribbon.css
@@ -5,9 +5,9 @@
.ribbon-holder {
position: absolute;
- top: 0;
overflow: hidden;
height: 10em;
+ top: 0;
}
.right.ribbon-holder {
@@ -18,9 +18,8 @@
left: 0;
}
-.ribbon,
-.ribbon:hover {
- text-decoration: none;
+.ribbon, .ribbon:hover {
+ text-decoration: none !important;
}
.ribbon {
@@ -30,11 +29,14 @@
padding: 0.25em 0;
position: relative;
+ display: block;
top: 2.5em;
/* Defaults friendly for white pages. */
- -moz-box-shadow: 0 0 13px #888;
-webkit-box-shadow: 0 0 13px #888;
+ -moz-box-shadow: 0 0 13px #888;
+ -ms-box-shadow: 0 0 13px #888;
+ -o-box-shadow: 0 0 13px #888;
box-shadow: 0 0 13px #888;
color: #FFF;
}
@@ -44,19 +46,19 @@
}
.right .ribbon {
- -o-transform: rotate(45deg);
- -ms-transform: rotate(45deg);
- -moz-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
+ -moz-transform: rotate(45deg);
+ -ms-transform: rotate(45deg);
+ -o-transform: rotate(45deg);
transform: rotate(45deg);
right: -2.5em;
}
.left .ribbon {
- -o-transform: rotate(-45deg);
- -ms-transform: rotate(-45deg);
- -moz-transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
+ -moz-transform: rotate(-45deg);
+ -ms-transform: rotate(-45deg);
+ -o-transform: rotate(-45deg);
transform: rotate(-45deg);
left: -2.5em;
}
@@ -64,13 +66,16 @@
.white.ribbon {
color: #111;
background-color: #F5F5F5;
- background: -moz-linear-gradient(top, #f3f3f3 0%, #ffffff 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f3f3f3), color-stop(100%,#ffffff));
background: -webkit-linear-gradient(top, #f3f3f3 0%,#ffffff 100%);
- background: -o-linear-gradient(top, #f3f3f3 0%,#ffffff 100%); background: -ms-linear-gradient(top, #f3f3f3 0%,#ffffff 100%);
+ background: -moz-linear-gradient(top, #f3f3f3 0%, #ffffff 100%);
+ background: -ms-linear-gradient(top, #f3f3f3 0%,#ffffff 100%);
+ background: -o-linear-gradient(top, #f3f3f3 0%,#ffffff 100%);
background: linear-gradient(top, #f3f3f3 0%,#ffffff 100%);
- -moz-box-shadow: 0 0 13px #999;
-webkit-box-shadow: 0 0 13px #999;
+ -moz-box-shadow: 0 0 13px #999;
+ -ms-box-shadow: 0 0 13px #999;
+ -o-box-shadow: 0 0 13px #999;
box-shadow: 0 0 13px #999;
text-shadow: 0 0 .05em;
}
@@ -81,10 +86,11 @@
.red.ribbon {
background-color: #9a0000;
- background: -moz-linear-gradient(top, #9a0000 0%, #a90000 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#9a0000), color-stop(100%,#a90000));
background: -webkit-linear-gradient(top, #9a0000 0%,#a90000 100%);
- background: -o-linear-gradient(top, #9a0000 0%,#a90000 100%); background: -ms-linear-gradient(top, #9a0000 0%,#a90000 100%);
+ background: -moz-linear-gradient(top, #9a0000 0%, #a90000 100%);
+ background: -ms-linear-gradient(top, #9a0000 0%,#a90000 100%);
+ background: -o-linear-gradient(top, #9a0000 0%,#a90000 100%);
background: linear-gradient(top, #9a0000 0%,#a90000 100%);
}
@@ -94,11 +100,11 @@
.green.ribbon {
background-color: #006e00;
- background-color: #006e00;
- background: -moz-linear-gradient(top, #006e00 0%, #007200 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#006e00), color-stop(100%,#007200));
background: -webkit-linear-gradient(top, #006e00 0%,#007200 100%);
- background: -o-linear-gradient(top, #006e00 0%,#007200 100%); background: -ms-linear-gradient(top, #006e00 0%,#007200 100%);
+ background: -moz-linear-gradient(top, #006e00 0%, #007200 100%);
+ background: -ms-linear-gradient(top, #006e00 0%,#007200 100%);
+ background: -o-linear-gradient(top, #006e00 0%,#007200 100%);
background: linear-gradient(top, #006e00 0%,#007200 100%);
}
@@ -117,11 +123,11 @@
.orange.ribbon {
background-color: #E57504;
- background-color: #E57504;
- background: -moz-linear-gradient(top, #dc7202 0%, #ee7906 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#dc7202), color-stop(100%,#ee7906));
background: -webkit-linear-gradient(top, #dc7202 0%,#ee7906 100%);
- background: -o-linear-gradient(top, #dc7202 0%,#ee7906 100%); background: -ms-linear-gradient(top, #dc7202 0%,#ee7906 100%);
+ background: -moz-linear-gradient(top, #dc7202 0%, #ee7906 100%);
+ background: -ms-linear-gradient(top, #dc7202 0%,#ee7906 100%);
+ background: -o-linear-gradient(top, #dc7202 0%,#ee7906 100%);
background: linear-gradient(top, #dc7202 0%,#ee7906 100%);
}
@@ -131,11 +137,11 @@
.gray.ribbon {
background-color: #6d6d6d;
- background-color: #6d6d6d;
- background: -moz-linear-gradient(top, #6a6a6a 0%, #6d6d6d 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#6a6a6a), color-stop(100%,#6d6d6d));
background: -webkit-linear-gradient(top, #6a6a6a 0%,#6d6d6d 100%);
- background: -o-linear-gradient(top, #6a6a6a 0%,#6d6d6d 100%); background: -ms-linear-gradient(top, #6a6a6a 0%,#6d6d6d 100%);
+ background: -moz-linear-gradient(top, #6a6a6a 0%, #6d6d6d 100%);
+ background: -ms-linear-gradient(top, #6a6a6a 0%,#6d6d6d 100%);
+ background: -o-linear-gradient(top, #6a6a6a 0%,#6d6d6d 100%);
background: linear-gradient(top, #6a6a6a 0%,#6d6d6d 100%);
}
Please sign in to comment.
Something went wrong with that request. Please try again.