Skip to content

Instantly share code, notes, and snippets.

@sethladd

sethladd/doc_layout.html

Created May 31, 2017 05:56
Show Gist options
  • Save sethladd/6e7f0721144e444f4d894865c8de54d2 to your computer and use it in GitHub Desktop.
Save sethladd/6e7f0721144e444f4d894865c8de54d2 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
doc_layout.html
<!doctype html>
<html>
<head>
<style>
html,
body {
margin: 0;
padding: 0;
height: 100%;
}
body {
display: flex;
flex-direction: column;
min-height: 100vh;
}
header {
flex: 0 0 56px;
background-color: red;
display: flex;
flex-direction: row;
align-items: center;
}
header ol {
list-style: none;
margin: 0;
padding: 0;
}
header ol li {
display: inline;
}
header form {
display: flex;
flex: 1;
justify-content: flex-end;
}
footer {
flex: 0 0 24px;
background-color: yellow;
display: flex;
justify-content: center;
align-items: center;
}
main {
flex: 1;
display: flex;
flex-direction: row;
}
main nav {
flex: 0 1 12em;
background-color: blueviolet;
overflow-y: auto;
}
article {
flex: 1;
overflow-y: auto;
}
article p {
max-width: 700px;
margin-left: auto;
margin-right: auto;
}
aside {
flex: 0 1 12em;
background-color: aqua;
overflow-y: auto;
}
</style>
</head>
<body>
<header>
<ol>
<li>Nav</li>
<li>Nav</li>
<li>Nav</li>
</ol>
<form>
<input type="text">
</form>
</header>
<main>
<nav>
<ol>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
</ol>
</nav>
<article>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque sit amet eros urna. Class aptent taciti sociosqu ad
litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum eu vulputate lectus. Cras et augue massa.
Cras maximus malesuada nisl, ac lacinia ante elementum ac. Nunc tincidunt sem nisl, sed luctus est pulvinar vulputate.
Nunc quis dolor nec leo mattis tincidunt ac sit amet ligula. Nulla bibendum lacus in quam iaculis volutpat ut quis
sapien. Donec condimentum sed purus sit amet vehicula. Mauris at tellus diam. Nam fermentum porttitor lacus, eu iaculis
nisi aliquam at. Curabitur quis turpis non urna lobortis posuere. Proin mi enim, euismod ut luctus eleifend, pellentesque
eget augue. Mauris convallis lacinia mi, non ultricies nunc varius vel.
</p>
<p>
Phasellus interdum risus ante, eu sagittis nibh iaculis non. Etiam mattis varius nisl, a maximus dui. Aliquam varius ex non
ex pretium, id dictum justo cursus. Etiam luctus orci arcu. Curabitur ut enim nec libero sagittis tincidunt quis
id mauris. Sed sit amet nisl pulvinar enim lacinia dictum. Duis nisi risus, lacinia eu urna in, scelerisque lobortis
orci. Nunc eget ipsum urna. Sed congue convallis finibus. Suspendisse sagittis nisl nec nibh tristique finibus. Praesent
vitae dapibus diam. Nunc eget sem scelerisque, tempus dolor convallis, convallis est. Curabitur tristique sapien
eu placerat pulvinar. Suspendisse potenti. Nullam bibendum nec leo id dapibus. Pellentesque quam ligula, luctus a
molestie nec, varius eu odio.
</p>
<p>
Donec arcu erat, varius non est a, condimentum efficitur metus. Nam sed magna elit. Maecenas eu mollis sem, at dictum turpis.
Aliquam a ornare lorem. Phasellus pulvinar nisi urna, dignissim vulputate enim suscipit ac. Proin et neque nec lacus
egestas pellentesque non quis lacus. Morbi ligula sapien, fringilla non iaculis vel, varius nec purus. Proin in sodales
ex. Suspendisse enim arcu, vestibulum non pellentesque pellentesque, consequat quis est. Suspendisse maximus, ipsum
nec dapibus interdum, magna sapien ornare metus, ac suscipit tortor nisi dictum nibh. Suspendisse sed est ac ex feugiat
ultricies id eget tellus.
</p>
<p>
Quisque commodo pulvinar feugiat. Donec id erat vehicula, mattis nulla ut, viverra nisl. Quisque viverra justo turpis, vitae
dapibus tortor convallis egestas. Nullam eget facilisis magna. Quisque in varius quam. Quisque a auctor lacus. Nullam
ultrices enim id dignissim egestas. Vivamus facilisis eleifend lorem eget maximus. Morbi laoreet congue semper. Aenean
elementum orci id volutpat vehicula. Praesent a libero id leo feugiat tempor et eu lacus. Quisque magna tortor, pellentesque
eu dapibus vitae, porta ac nisl. Proin lorem nulla, pulvinar vel dolor a, dignissim mollis leo. Etiam turpis lacus,
pharetra dapibus placerat nec, egestas pharetra ex.
</p>
<p>
Curabitur vestibulum et nisl a tincidunt. Proin placerat pharetra congue. Sed nisl eros, tempus vel quam in, tincidunt rhoncus
ex. Cras in cursus mauris, quis volutpat odio. Phasellus vitae velit ante. Class aptent taciti sociosqu ad litora
torquent per conubia nostra, per inceptos himenaeos. Aenean nunc augue, varius ullamcorper convallis in, gravida
condimentum arcu. Vestibulum in odio dignissim, pulvinar mi sit amet, blandit arcu. Cras facilisis tortor eros, vitae
rhoncus lacus ornare quis. Duis aliquet, orci eget auctor tincidunt, sem mauris mattis turpis, sit amet facilisis
ipsum nisl vitae est. Sed eu dolor bibendum, convallis arcu in, euismod erat. Mauris mauris justo, malesuada non
sapien ut, dictum porta justo.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque sit amet eros urna. Class aptent taciti sociosqu ad
litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum eu vulputate lectus. Cras et augue massa.
Cras maximus malesuada nisl, ac lacinia ante elementum ac. Nunc tincidunt sem nisl, sed luctus est pulvinar vulputate.
Nunc quis dolor nec leo mattis tincidunt ac sit amet ligula. Nulla bibendum lacus in quam iaculis volutpat ut quis
sapien. Donec condimentum sed purus sit amet vehicula. Mauris at tellus diam. Nam fermentum porttitor lacus, eu iaculis
nisi aliquam at. Curabitur quis turpis non urna lobortis posuere. Proin mi enim, euismod ut luctus eleifend, pellentesque
eget augue. Mauris convallis lacinia mi, non ultricies nunc varius vel.
</p>
<p>
Phasellus interdum risus ante, eu sagittis nibh iaculis non. Etiam mattis varius nisl, a maximus dui. Aliquam varius ex non
ex pretium, id dictum justo cursus. Etiam luctus orci arcu. Curabitur ut enim nec libero sagittis tincidunt quis
id mauris. Sed sit amet nisl pulvinar enim lacinia dictum. Duis nisi risus, lacinia eu urna in, scelerisque lobortis
orci. Nunc eget ipsum urna. Sed congue convallis finibus. Suspendisse sagittis nisl nec nibh tristique finibus. Praesent
vitae dapibus diam. Nunc eget sem scelerisque, tempus dolor convallis, convallis est. Curabitur tristique sapien
eu placerat pulvinar. Suspendisse potenti. Nullam bibendum nec leo id dapibus. Pellentesque quam ligula, luctus a
molestie nec, varius eu odio.
</p>
<p>
Donec arcu erat, varius non est a, condimentum efficitur metus. Nam sed magna elit. Maecenas eu mollis sem, at dictum turpis.
Aliquam a ornare lorem. Phasellus pulvinar nisi urna, dignissim vulputate enim suscipit ac. Proin et neque nec lacus
egestas pellentesque non quis lacus. Morbi ligula sapien, fringilla non iaculis vel, varius nec purus. Proin in sodales
ex. Suspendisse enim arcu, vestibulum non pellentesque pellentesque, consequat quis est. Suspendisse maximus, ipsum
nec dapibus interdum, magna sapien ornare metus, ac suscipit tortor nisi dictum nibh. Suspendisse sed est ac ex feugiat
ultricies id eget tellus.
</p>
<p>
Quisque commodo pulvinar feugiat. Donec id erat vehicula, mattis nulla ut, viverra nisl. Quisque viverra justo turpis, vitae
dapibus tortor convallis egestas. Nullam eget facilisis magna. Quisque in varius quam. Quisque a auctor lacus. Nullam
ultrices enim id dignissim egestas. Vivamus facilisis eleifend lorem eget maximus. Morbi laoreet congue semper. Aenean
elementum orci id volutpat vehicula. Praesent a libero id leo feugiat tempor et eu lacus. Quisque magna tortor, pellentesque
eu dapibus vitae, porta ac nisl. Proin lorem nulla, pulvinar vel dolor a, dignissim mollis leo. Etiam turpis lacus,
pharetra dapibus placerat nec, egestas pharetra ex.
</p>
<p>
Curabitur vestibulum et nisl a tincidunt. Proin placerat pharetra congue. Sed nisl eros, tempus vel quam in, tincidunt rhoncus
ex. Cras in cursus mauris, quis volutpat odio. Phasellus vitae velit ante. Class aptent taciti sociosqu ad litora
torquent per conubia nostra, per inceptos himenaeos. Aenean nunc augue, varius ullamcorper convallis in, gravida
condimentum arcu. Vestibulum in odio dignissim, pulvinar mi sit amet, blandit arcu. Cras facilisis tortor eros, vitae
rhoncus lacus ornare quis. Duis aliquet, orci eget auctor tincidunt, sem mauris mattis turpis, sit amet facilisis
ipsum nisl vitae est. Sed eu dolor bibendum, convallis arcu in, euismod erat. Mauris mauris justo, malesuada non
sapien ut, dictum porta justo.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque sit amet eros urna. Class aptent taciti sociosqu ad
litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum eu vulputate lectus. Cras et augue massa.
Cras maximus malesuada nisl, ac lacinia ante elementum ac. Nunc tincidunt sem nisl, sed luctus est pulvinar vulputate.
Nunc quis dolor nec leo mattis tincidunt ac sit amet ligula. Nulla bibendum lacus in quam iaculis volutpat ut quis
sapien. Donec condimentum sed purus sit amet vehicula. Mauris at tellus diam. Nam fermentum porttitor lacus, eu iaculis
nisi aliquam at. Curabitur quis turpis non urna lobortis posuere. Proin mi enim, euismod ut luctus eleifend, pellentesque
eget augue. Mauris convallis lacinia mi, non ultricies nunc varius vel.
</p>
<p>
Phasellus interdum risus ante, eu sagittis nibh iaculis non. Etiam mattis varius nisl, a maximus dui. Aliquam varius ex non
ex pretium, id dictum justo cursus. Etiam luctus orci arcu. Curabitur ut enim nec libero sagittis tincidunt quis
id mauris. Sed sit amet nisl pulvinar enim lacinia dictum. Duis nisi risus, lacinia eu urna in, scelerisque lobortis
orci. Nunc eget ipsum urna. Sed congue convallis finibus. Suspendisse sagittis nisl nec nibh tristique finibus. Praesent
vitae dapibus diam. Nunc eget sem scelerisque, tempus dolor convallis, convallis est. Curabitur tristique sapien
eu placerat pulvinar. Suspendisse potenti. Nullam bibendum nec leo id dapibus. Pellentesque quam ligula, luctus a
molestie nec, varius eu odio.
</p>
<p>
Donec arcu erat, varius non est a, condimentum efficitur metus. Nam sed magna elit. Maecenas eu mollis sem, at dictum turpis.
Aliquam a ornare lorem. Phasellus pulvinar nisi urna, dignissim vulputate enim suscipit ac. Proin et neque nec lacus
egestas pellentesque non quis lacus. Morbi ligula sapien, fringilla non iaculis vel, varius nec purus. Proin in sodales
ex. Suspendisse enim arcu, vestibulum non pellentesque pellentesque, consequat quis est. Suspendisse maximus, ipsum
nec dapibus interdum, magna sapien ornare metus, ac suscipit tortor nisi dictum nibh. Suspendisse sed est ac ex feugiat
ultricies id eget tellus.
</p>
<p>
Quisque commodo pulvinar feugiat. Donec id erat vehicula, mattis nulla ut, viverra nisl. Quisque viverra justo turpis, vitae
dapibus tortor convallis egestas. Nullam eget facilisis magna. Quisque in varius quam. Quisque a auctor lacus. Nullam
ultrices enim id dignissim egestas. Vivamus facilisis eleifend lorem eget maximus. Morbi laoreet congue semper. Aenean
elementum orci id volutpat vehicula. Praesent a libero id leo feugiat tempor et eu lacus. Quisque magna tortor, pellentesque
eu dapibus vitae, porta ac nisl. Proin lorem nulla, pulvinar vel dolor a, dignissim mollis leo. Etiam turpis lacus,
pharetra dapibus placerat nec, egestas pharetra ex.
</p>
<p>
Curabitur vestibulum et nisl a tincidunt. Proin placerat pharetra congue. Sed nisl eros, tempus vel quam in, tincidunt rhoncus
ex. Cras in cursus mauris, quis volutpat odio. Phasellus vitae velit ante. Class aptent taciti sociosqu ad litora
torquent per conubia nostra, per inceptos himenaeos. Aenean nunc augue, varius ullamcorper convallis in, gravida
condimentum arcu. Vestibulum in odio dignissim, pulvinar mi sit amet, blandit arcu. Cras facilisis tortor eros, vitae
rhoncus lacus ornare quis. Duis aliquet, orci eget auctor tincidunt, sem mauris mattis turpis, sit amet facilisis
ipsum nisl vitae est. Sed eu dolor bibendum, convallis arcu in, euismod erat. Mauris mauris justo, malesuada non
sapien ut, dictum porta justo.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque sit amet eros urna. Class aptent taciti sociosqu ad
litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum eu vulputate lectus. Cras et augue massa.
Cras maximus malesuada nisl, ac lacinia ante elementum ac. Nunc tincidunt sem nisl, sed luctus est pulvinar vulputate.
Nunc quis dolor nec leo mattis tincidunt ac sit amet ligula. Nulla bibendum lacus in quam iaculis volutpat ut quis
sapien. Donec condimentum sed purus sit amet vehicula. Mauris at tellus diam. Nam fermentum porttitor lacus, eu iaculis
nisi aliquam at. Curabitur quis turpis non urna lobortis posuere. Proin mi enim, euismod ut luctus eleifend, pellentesque
eget augue. Mauris convallis lacinia mi, non ultricies nunc varius vel.
</p>
<p>
Phasellus interdum risus ante, eu sagittis nibh iaculis non. Etiam mattis varius nisl, a maximus dui. Aliquam varius ex non
ex pretium, id dictum justo cursus. Etiam luctus orci arcu. Curabitur ut enim nec libero sagittis tincidunt quis
id mauris. Sed sit amet nisl pulvinar enim lacinia dictum. Duis nisi risus, lacinia eu urna in, scelerisque lobortis
orci. Nunc eget ipsum urna. Sed congue convallis finibus. Suspendisse sagittis nisl nec nibh tristique finibus. Praesent
vitae dapibus diam. Nunc eget sem scelerisque, tempus dolor convallis, convallis est. Curabitur tristique sapien
eu placerat pulvinar. Suspendisse potenti. Nullam bibendum nec leo id dapibus. Pellentesque quam ligula, luctus a
molestie nec, varius eu odio.
</p>
<p>
Donec arcu erat, varius non est a, condimentum efficitur metus. Nam sed magna elit. Maecenas eu mollis sem, at dictum turpis.
Aliquam a ornare lorem. Phasellus pulvinar nisi urna, dignissim vulputate enim suscipit ac. Proin et neque nec lacus
egestas pellentesque non quis lacus. Morbi ligula sapien, fringilla non iaculis vel, varius nec purus. Proin in sodales
ex. Suspendisse enim arcu, vestibulum non pellentesque pellentesque, consequat quis est. Suspendisse maximus, ipsum
nec dapibus interdum, magna sapien ornare metus, ac suscipit tortor nisi dictum nibh. Suspendisse sed est ac ex feugiat
ultricies id eget tellus.
</p>
<p>
Quisque commodo pulvinar feugiat. Donec id erat vehicula, mattis nulla ut, viverra nisl. Quisque viverra justo turpis, vitae
dapibus tortor convallis egestas. Nullam eget facilisis magna. Quisque in varius quam. Quisque a auctor lacus. Nullam
ultrices enim id dignissim egestas. Vivamus facilisis eleifend lorem eget maximus. Morbi laoreet congue semper. Aenean
elementum orci id volutpat vehicula. Praesent a libero id leo feugiat tempor et eu lacus. Quisque magna tortor, pellentesque
eu dapibus vitae, porta ac nisl. Proin lorem nulla, pulvinar vel dolor a, dignissim mollis leo. Etiam turpis lacus,
pharetra dapibus placerat nec, egestas pharetra ex.
</p>
<p>
Curabitur vestibulum et nisl a tincidunt. Proin placerat pharetra congue. Sed nisl eros, tempus vel quam in, tincidunt rhoncus
ex. Cras in cursus mauris, quis volutpat odio. Phasellus vitae velit ante. Class aptent taciti sociosqu ad litora
torquent per conubia nostra, per inceptos himenaeos. Aenean nunc augue, varius ullamcorper convallis in, gravida
condimentum arcu. Vestibulum in odio dignissim, pulvinar mi sit amet, blandit arcu. Cras facilisis tortor eros, vitae
rhoncus lacus ornare quis. Duis aliquet, orci eget auctor tincidunt, sem mauris mattis turpis, sit amet facilisis
ipsum nisl vitae est. Sed eu dolor bibendum, convallis arcu in, euismod erat. Mauris mauris justo, malesuada non
sapien ut, dictum porta justo.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque sit amet eros urna. Class aptent taciti sociosqu ad
litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum eu vulputate lectus. Cras et augue massa.
Cras maximus malesuada nisl, ac lacinia ante elementum ac. Nunc tincidunt sem nisl, sed luctus est pulvinar vulputate.
Nunc quis dolor nec leo mattis tincidunt ac sit amet ligula. Nulla bibendum lacus in quam iaculis volutpat ut quis
sapien. Donec condimentum sed purus sit amet vehicula. Mauris at tellus diam. Nam fermentum porttitor lacus, eu iaculis
nisi aliquam at. Curabitur quis turpis non urna lobortis posuere. Proin mi enim, euismod ut luctus eleifend, pellentesque
eget augue. Mauris convallis lacinia mi, non ultricies nunc varius vel.
</p>
<p>
Phasellus interdum risus ante, eu sagittis nibh iaculis non. Etiam mattis varius nisl, a maximus dui. Aliquam varius ex non
ex pretium, id dictum justo cursus. Etiam luctus orci arcu. Curabitur ut enim nec libero sagittis tincidunt quis
id mauris. Sed sit amet nisl pulvinar enim lacinia dictum. Duis nisi risus, lacinia eu urna in, scelerisque lobortis
orci. Nunc eget ipsum urna. Sed congue convallis finibus. Suspendisse sagittis nisl nec nibh tristique finibus. Praesent
vitae dapibus diam. Nunc eget sem scelerisque, tempus dolor convallis, convallis est. Curabitur tristique sapien
eu placerat pulvinar. Suspendisse potenti. Nullam bibendum nec leo id dapibus. Pellentesque quam ligula, luctus a
molestie nec, varius eu odio.
</p>
<p>
Donec arcu erat, varius non est a, condimentum efficitur metus. Nam sed magna elit. Maecenas eu mollis sem, at dictum turpis.
Aliquam a ornare lorem. Phasellus pulvinar nisi urna, dignissim vulputate enim suscipit ac. Proin et neque nec lacus
egestas pellentesque non quis lacus. Morbi ligula sapien, fringilla non iaculis vel, varius nec purus. Proin in sodales
ex. Suspendisse enim arcu, vestibulum non pellentesque pellentesque, consequat quis est. Suspendisse maximus, ipsum
nec dapibus interdum, magna sapien ornare metus, ac suscipit tortor nisi dictum nibh. Suspendisse sed est ac ex feugiat
ultricies id eget tellus.
</p>
<p>
Quisque commodo pulvinar feugiat. Donec id erat vehicula, mattis nulla ut, viverra nisl. Quisque viverra justo turpis, vitae
dapibus tortor convallis egestas. Nullam eget facilisis magna. Quisque in varius quam. Quisque a auctor lacus. Nullam
ultrices enim id dignissim egestas. Vivamus facilisis eleifend lorem eget maximus. Morbi laoreet congue semper. Aenean
elementum orci id volutpat vehicula. Praesent a libero id leo feugiat tempor et eu lacus. Quisque magna tortor, pellentesque
eu dapibus vitae, porta ac nisl. Proin lorem nulla, pulvinar vel dolor a, dignissim mollis leo. Etiam turpis lacus,
pharetra dapibus placerat nec, egestas pharetra ex.
</p>
<p>
Curabitur vestibulum et nisl a tincidunt. Proin placerat pharetra congue. Sed nisl eros, tempus vel quam in, tincidunt rhoncus
ex. Cras in cursus mauris, quis volutpat odio. Phasellus vitae velit ante. Class aptent taciti sociosqu ad litora
torquent per conubia nostra, per inceptos himenaeos. Aenean nunc augue, varius ullamcorper convallis in, gravida
condimentum arcu. Vestibulum in odio dignissim, pulvinar mi sit amet, blandit arcu. Cras facilisis tortor eros, vitae
rhoncus lacus ornare quis. Duis aliquet, orci eget auctor tincidunt, sem mauris mattis turpis, sit amet facilisis
ipsum nisl vitae est. Sed eu dolor bibendum, convallis arcu in, euismod erat. Mauris mauris justo, malesuada non
sapien ut, dictum porta justo.
</p>
</article>
<aside>
<ol>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
<li>fffffff</li>
</ol>
</aside>
</main>
<footer>
<div>
&copy; awesome docs corp.
</div>
</footer>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment