Merge pull request #2 from jankeromnes/master

Added `display:block` on .ribbon
jbalogh · Mar 2, 2012 · fb42aa8 · fb42aa8
2 parents e2bc240 + a5560f1
commit fb42aa8
Showing 1 changed file with 31 additions and 25 deletions.
diff --git a/ribbon.css b/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, .ribbon:hover {
-.ribbon:hover {
+  text-decoration: none !important;
-  text-decoration: none;
 }
 
 .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,33 +46,36 @@
 }
 
 .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;
 }
 
 .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%);
 }