Skip to content

Instantly share code, notes, and snippets.

@jrhorn424
Forked from flauwekeul/vertical-center-child.scss
Last active August 29, 2015 14:16
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save jrhorn424/807aa1df27837bb6526e to your computer and use it in GitHub Desktop.
Save jrhorn424/807aa1df27837bb6526e to your computer and use it in GitHub Desktop.
// Inspired by http://css-tricks.com/vertically-center-multi-lined-text/
@mixin vertical-center-children($height: auto, $children: ':first-child') {
display: table;
height: $height;
#{$children} {
display: table-cell;
vertical-align: middle;
}
}
/* Example usage:
HTML:
<div class="container">
<div class="child">This div gets vertically centered :)</div>
</div>
SCSS:
.container {
@include vertical-center-children(200px);
}
*/
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment