Skip to content

Instantly share code, notes, and snippets.

@Angelfire
Created June 27, 2016 20:05
Show Gist options
  • Save Angelfire/92d74b0aac30ad3bd3247e3b5561524c to your computer and use it in GitHub Desktop.
Save Angelfire/92d74b0aac30ad3bd3247e3b5561524c to your computer and use it in GitHub Desktop.
SASS mixin for :before and :after background images
@mixin before-after-background($height, $side-width, $before, $after) {
height: $height;
position: relative;
z-index: 1;
&:before, &:after {
content: '';
display: block;
height: $height;
position: absolute;
top: 0px;
width: $side-width;
z-index: -1;
}
&:before {
background-image: $before;
left: -$side-width;
}
&:after {
background-image: $after;
right: -$side-width;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment