title: Make a <div> square when there is a dynamically changing width based on percentage
body: <p>I am working on a web app that will generate an NxN grid based on the user's selection of N. I want the total width of the grid to be relative (ie 100% of the available space) so that users can print on various paper sizes. </p>
  
  <p>I can easily calculate the width of the squares in the grid by % (ie: 100%/N), but I am having issues calculating the height. The height of a web page is always going to be infinite unless I artificially limit it which, like I said, I don't want to do. </p>
  
  <p>How can I make <strong>the squares in my grid be square</strong> versus rectangular when the height and width constraints of my grid are dynamic and not square?</p>