title: css grid - dynamic number of columns matching auto width
body: <p>I really don't think this should be quite so hard.  I have an unknown number of columns to display in a css grid.  I want all the columns to be the same width to match the content.  I want it to be min-content so the text will wrap when it gets too long.  I have tried many different variations.  But essentially, this is what I think I want and not sure why the browser says "invalid property value" on the <code>grid-template-columns</code> line.</p>
  
  <pre><code>.flyer-container &gt; div {
    width: 100%;
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: repeat(auto-fit, minmax(min-content, 1fr));
  }
  </code></pre>