Skip to content

Instantly share code, notes, and snippets.

@jirkapenzes
Created April 23, 2021 10:35
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 jirkapenzes/de096fad2e9e0c95fbe096c97f1adef0 to your computer and use it in GitHub Desktop.
Save jirkapenzes/de096fad2e9e0c95fbe096c97f1adef0 to your computer and use it in GitHub Desktop.
Simple Template - Header - Content - Footer
<!DOCTYPE html>
<html>
<head>
<title>Simple Template</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta property="og:title" content="Simple Template" />
<style>
html,
body {
background-color: #F5F5F5;
margin: 0;
padding: 0;
width: 100%;
height: 100%;
}
*,
*:before,
*:after {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.layout-wrapper {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: stretch;
align-content: stretch;
}
.content-area {
flex: 1;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: stretch;
align-content: stretch;
}
</style>
</head>
<body>
<div class="layout-wrapper">
<div>
Header
</div>
<div class="content-area">
Content
</div>
<div>
Footer
</div>
</div>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment