CSS print custom headers/footers

Demonstrates manual header/footer per manually built page

by b9chris

HTML

<div class=page>
  <header></header>
  <div class=content>Content</div>
  <footer></footer>
</div>

SCSS

body {
  font: 10pt Verdana;
  color: #fff;
  background: #000;
  @media screen {
    width: 7.5in;
    margin: 0 auto;
  }
}

div.page {
  display: flex;
  @media screen {
    height: 200px;
  }
  @media print {
    height: 10in;    
  }
  flex-flow: column nowrap;
  justify-content: space-between;
  align-content: stretch;
}
header { background: #a00; }
footer { background: #00b; }

div.content {
  flex-grow: 1;
  background: #090;
}

@media print {
  @page {
    size: letter;  // US 8.5in x 11in
    margin: .5in;
  }
  
  footer {
    page-break-after: always;
  }
}

JavaScript

var catIpsum = "Nap all day eat the fat cats food or stare at the wall, play with food and get confused by dust cat slap dog in face, so woops poop hanging from butt must get rid run run around house drag poop on floor maybe it comes off woops left brown marks on floor human slave clean lick butt now dismember a mouse and then regurgitate parts of it on the family room floor. Spit up on light gray carpet instead of adjacent linoleum hide when guests come over, meowzer. Meow meow we are 3 small kittens sleeping most of our time, we are around 15 weeks old i think, i don’t know i can’t count kitten is playing with dead mouse stand with legs in litter box, but poop outside i hate cucumber pls dont throw it at me or hide at bottom of staircase to trip human, eat a rug and furry furry hairs everywhere oh no human coming lie on counter don't get off counter or ooooh feather moving feather!. Hunt by meowing loudly at 5am next to human slave food dispenser wake up wander around the house making large amounts of noise jump on top of your human's bed and fall asleep again for flop over curl up and sleep on the freshly laundered towels and experiences short bursts of poo-phoria after going to the loo, yet lick butt and make a weird face. In the middle of the night i crawl onto your chest and purr gently to help you sleep hey! you there, with the hands so sit on human they not getting up ever so sit on human but prance along on top of the garden fence, annoy the neighbor's dog and make it bark so you are a captive audience while sitting on the toilet, pet me. Make muffins crusty butthole grab pompom in mouth and put in water dish, for while happily ignoring when being called litter kitter kitty litty little kitten big roar roar feed me.".split(' ');

var page = $('div.page');
$('body').append(page.clone(true)).append(page.clone(true));

setInterval(function() {
	var l = catIpsum.length;
	$('header, footer').each(function(i, tag) {
  	var i = Math.floor(Math.random() *...