Skip to content

Instantly share code, notes, and snippets.

@tilleps

tilleps/gist:dbcdd8718de5a2b8d0fa0c51c7c06481

Created March 16, 2020 10:15
Show Gist options
  • Save tilleps/dbcdd8718de5a2b8d0fa0c51c7c06481 to your computer and use it in GitHub Desktop.
Save tilleps/dbcdd8718de5a2b8d0fa0c51c7c06481 to your computer and use it in GitHub Desktop.
Download ZIP
Layout Example
Raw
gistfile1.txt
<html>
<head>
<style>
* {
margin: 0;
}
</style>
</head>
<body>
<div style="display: flex; flex-direction: column; min-height: 100vh;">
<div style="flex-shrink: 0; overflow: auto; background: #ccddff;">
HEADER
</div>
<div style="flex-shrink: 0; overflow: auto;">
<div style="margin: 0 auto; align-self: center; overflow: auto; max-width: 420px; padding: 1rem; border-radius: 0.5rem; background: #eee;">
BANNER
</div>
</div>
<div style="flex: 1 0 auto; display: flex; align-items: flex-start; background: #aaeeee;">
<div style="margin: 0 auto; align-self: top; overflow: auto; background: #f8f8f8; width: 980px;">
BODY
</div>
</div>
<div style="flex-shrink: 0; overflow: auto;">
FOOTER
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment