Skip to content

Instantly share code, notes, and snippets.

@brandonb927

brandonb927/hull-height-square.css

Created August 29, 2016 17:52
Show Gist options
  • Save brandonb927/e518305ab29adc8b17e0056215826f36 to your computer and use it in GitHub Desktop.
Save brandonb927/e518305ab29adc8b17e0056215826f36 to your computer and use it in GitHub Desktop.
Download ZIP
Makes a square as large as possible in the viewport without overflowing and centres it vertically and horizontally - https://twitter.com/mikeriethmuller/status/769922629260181504
Raw
hull-height-square.css
.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