Skip to content

Instantly share code, notes, and snippets.

@rocbear
Last active September 4, 2015 12:33
Show Gist options
  • Save rocbear/8c7f85744502b8c54f7a to your computer and use it in GitHub Desktop.
Save rocbear/8c7f85744502b8c54f7a to your computer and use it in GitHub Desktop.
SCSS place something in the four corners of a container [with Bourbon]
@import "bourbon";
$padding: 1em;
$positions: ("t", "l"), ("t", "r"), ("b", "r"), ("b", "l");
@each $v, $h in $positions {
#{".position-" + $v + $h} {
@include position(absolute,
if($v == "t", $padding, auto)
if($h == "r", $padding, auto)
if($v == "b", $padding, auto)
if($h == "l", $padding, auto)
);
}
}
/*
Outputs:
.position-tl { ...
.position-tr { ...
.position-br { ...
.position-bl { ...
*/
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment