display: inline-block; 隙間をマイナスマージンで作る

下記の場合は39px空く。ulにマイナスマージン、liにマージン入れる
ついでにulに letter-spacing: -.4em; liにletter-spacing: normal; で隙間をなくす

    ul{
      padding: 60px 0 0 0;
      letter-spacing: -.4em;
      margin-left: -39px;
      margin-bottom: -39px;
      li{
        letter-spacing: normal;
        width: 300px;
        display: inline-block;
        vertical-align: top;
        background:#fff;
        margin-left: 39px;
        margin-bottom: 39px;
        img{
          width: 100%;
        }
      }