Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
How I use Sass's @extend withing @media directives
@media screen {
/* Contain floats: h5bp.com/q */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }
/* For image replacement */
.ir {
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
}
.ir br { display: none; }
.course-list {
@extend .clearfix;
list-style: none;
li {
float: left;
width: 20px;
&:before {
@extend .ir;
content: "";
@include sprites-sprite(arrow_left_blue_mini);
display: inline-block;
margin: 0 2px 0 0 ;
width: 4px; height: 7px;
}
}
}
// Print styles below, yo.
@media print {
.course-list {
list-style: disc outside;
margin: 1in;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment