Skip to content

Instantly share code, notes, and snippets.

@brandonb927
Created August 29, 2016 17:52
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save brandonb927/e518305ab29adc8b17e0056215826f36 to your computer and use it in GitHub Desktop.
Save brandonb927/e518305ab29adc8b17e0056215826f36 to your computer and use it in GitHub Desktop.
Makes a square as large as possible in the viewport without overflowing and centres it vertically and horizontally - https://twitter.com/mikeriethmuller/status/769922629260181504
.elem {
width: 100vmin;
height: 100vmin;
margin-top: calc((100vh - 100vmin)/2);
margin-left: calc((100vw - 100vmin)/2);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment