背景图片图标尺寸不正确（较小）

Question

我有一个完整的黄色背景，在这个背景中有一些图标。例如在1920x1080的大屏幕中，我希望有17列图标水平占据黄色背景和4行图标。

问题是图标尺寸不正确，尺寸较小，因此我会获得超过30列图标而不是17列图标。而不是4行，我得到8行图标。

你知道如何解决这个问题吗？

HTML：

<section class="container content-search">
  <div class="div">
    <h1>Title</h1>

  </div>
  <section>

的CSS：

.content-search {
  height: 100%;
  width: 100%;
  position: relative;
  background: rgba(255, 255, 0, .54);
  min-height: 360px;
}

.content-search:after {
  content: '';
  position: absolute;
  z-index: -1;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: url(https://preview.ibb.co/cxLLc5/img22.png) 0 0 / auto 50%;
  opacity: .25;
}

.div {
  width: 60%;
  margin: 0 auto;
  padding: 20px 0;
}

例如： https://jsfiddle.net/h6apm4pc/1/