Ask DN : Whats your favourite CSS hack / quick fix?

hacks.scss

// Ask DN : Whats your favourite CSS hack / quick fix?
// https://news.layervault.com/stories/24631-ask-dn--whats-your-favourite-css-hack--quick-fix

/* Helps you do skeletal prototyping without worrying about colour or content */
*{outline:1px solid rgba(255,0,85,0.2)}

/* CLEARFIX!!! based on http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demystified/ */
.cf:before,
.cf:after {
  content: ".";    
  display: block;    
  height: 0;    
  overflow: hidden;	
}
.cf:after {clear: both;}
.cf {zoom: 1;} /* IE < 8 */

// Vertically center any object within its container. Works in IE9 and up.
// @include vertical-center;
@mixin vertical-center {
	position: relative;
	top: 50%;
	transform: translateY(-50%);
}

// Not a hack but a quick bit of Sass for staggering transitions:
.element {
  @for $i from 1 through 5 {
     &:nth-child(#{$i}) {
       @include transition-delay($i*100ms);
     }
  }
}

// Maybe not absolute favorite hack,
// but I recently learned about a padding hack
// popularly used to style/scale Videos or SVGs.
// Useful for responsive web related tasks.
// http://alistapart.com/article/creating-intrinsic-ratios-for-video
.wrapper-with-intrinsic-ratio {
    position: relative; padding-bottom: 20%; height: 0; 
}
.element-to-stretch {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: teal;
}


// Scale up image links on hover:
a.scale-image {
    overflow: hidden;
    img { transition: transform 0.3s; }
    &:hover {
        img { transform: scale(1.1); }
    }
}