Edit on
<ul class="products">
  <li class="product">
    <img src="http://www.fillmurray.com/120/120" />
    <h1>£150</h1>
  </li>
  <li class="product">
    <img src="http://www.fillmurray.com/120/120" />
    <h1>£150</h1>
  </li>
  <li class="product">
    <img src="http://www.fillmurray.com/120/120" />
    <h1>£150</h1>
  </li>

  <li class="product">
    <img src="http://www.fillmurray.com/120/120" />
    <h1>£150</h1>
  </li>
  <li class="product">
    <img src="http://www.fillmurray.com/120/120" />
    <h1>£150</h1>
  </li>
  <li class="product">
    <img src="http://www.fillmurray.com/120/120" />
    <h1>£150</h1>
  </li>
</ul>
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  
  font:normal bold 20px/1 sans-serif;
}
img {
  max-width:100%;
  vertical-align:bottom;
}
h1 {
  margin:10px 0 0;
}


.products {
  width:650px;
  padding: 10px 10px 0 10px;
  margin: 0;
  list-style: none;
  background: #444;
  
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  
  -webkit-flex-flow: row wrap;
  flex-flow: row wrap;
  
  -webkit-justify-content: space-between;
  justify-content: space-between;
}

.product {
  -webkit-flex: 0 0 auto;
  flex: 0 0 auto;
  
  margin-bottom:10px;
  padding:10px;
  background:#222;
  color: white;
  text-align: center;
}
Rerun