title: How to use minmax func to limit amount of columns
body: <p>I'm trying to create a responsive grid design with css-grid. I want to have columns that are about 400px and can expand to 500px. When a grid cell can no longer occupy its space, I want it to wrap. Essentially, on small viewports, I want a column of one while on bigger viewports, I want a max of 2 columns. Is there a way of doing this without media queries? I'm trying to avoid this since I have a sidebar that can expand which does not alter the view width.</p>
  
  <pre class="lang-css prettyprint-override"><code>.grid-wrapper {
    display: grid;
    /* below line DOES NOT WORK */
    grid-template-columns: repeat(minmax(1, 2), minmax(400, 500));
  }
  </code></pre>