title: Creating a responsive grid, stacks, with responsive images
body: <p>I created a question earlier about making a responsive grid, and got it working thanks to the help of everyone here, but now I'm struggling with the next stage.</p>
  
  <p>I want a grid with three columns (three images) with are each 33.3% in width. I then have an image inside the <code>max-width:100%</code> in order to make them scale to the width of their containers.</p>
  
  <p>Now I'm stuck on making them stack at an average mobile resolution. So essentially when they become too small to be easily viewed as three in a row, I want them to go down to 2 on a row (making 3 rows totalling 6 images) and then down to just one per row in a long stack.</p>
  
  <p>JS Fiddle <a href="http://jsfiddle.net/abrdn/15/" rel="nofollow">here</a></p>