Skip to content

Instantly share code, notes, and snippets.

@jomoespe

jomoespe/html-flex-basic-template.html

Created September 4, 2017 21:04
Show Gist options
  • Save jomoespe/98038d4fb605238c43f9e31a36cda4cf to your computer and use it in GitHub Desktop.
Save jomoespe/98038d4fb605238c43f9e31a36cda4cf to your computer and use it in GitHub Desktop.
Download ZIP
A simple example of flex layout
Raw
html-flex-basic-template.html
<html>
<style type="text/css">
* {
margin: 0;
padding: 0;
font-size: 10px;
}
div {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
align-content: center;
height: 5rem;
border: solid 1px lightgray;
}
div section {
flex-grow: 1;
border: solid 1px gray;
}
</style>
<div>
<section>Section 1</section>
<section>Section 2</section>
<section>Section 3</section>
</div>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment