我不知道如何在我的网站上创建响应列？ 图片：

问题描述

我很难使该网格响应。我有2行3列，每行都有图片和文本。图片大小相同。我想使其具有响应性，因此当它达到一定的宽度时，各列彼此重新定位，并且字体大小更改为较小的字体。谢谢！

图片：

.domov2 {
  width: 100%;
  padding: 0px 0 50px 0;
  background-color: #D5D7D7;
  min-height: 450px;
}

.domov22 {
  width: 80%;
  max-width: 960px;
  min-width: 960px;
  overflow: hidden;
  margin: 0;
  margin-right: auto;
  margin-left: auto;
  min-height: 450px;
}

.grid-container {
  position: relative;
  column-gap: 10%;
  row-gap: 50px;
  margin: 50px 0px 0px 0px;
  /* top right bot left*/
  display: grid;
  grid-template-columns: 23% 24% 23%;
  grid-template-rows: 300px 300px;
  padding: 10px;
  text-align: justify;
}

.slika {
  display: block;
  margin-left: auto;
  margin-right: auto;
  max-width: 220px;
  min-width: 220px;
}

.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

<section class="domov2">
  <section class="domov22">
    <div class="grid-container">

      <div>
        <div class=slika> <img src="slike/computer.png" height=140 class="center"></div><br> Izdelamo vam vizualno atraktivno,urejeno spletno stran.</div>

      <div>
        <div class=slika> <img src="slike/presentation.png" height=140 class="center"></div><br> Povečajte svojo prodajo in prepoznavnost s privlačno in urejeno spletno stranjo.</div>

      <div>
        <div class=slika> <img src="slike/brand.png" height=140 class="center"></div><br> SEO optimizacija. Vašo spletno stran optimiziramo tako,da bo dosegala visoke pozicije na “google” iskalniku.</div>

      <div>
        <div class=slika> <img src="slike/support.png" height=140 class="center"></div><br> Zastonj vzdrževanje (posodabljanje vtičnikov in varnostno kopiranje) prve tri mesece po izdelavi spletne strani.</div>

      <div>
        <div class=slika> <img src="slike/consulting.png" height=140 class="center"></div><br> Hitra,prijazna in odzivna podpora uporabnikom.</div>

      <div>
        <div class=slika> <img src="slike/discussion.png" height=140 class="center"></div><br> Nudimo brezplačno prvo svetovanje na daljavo. </div>
    </div>
  </section>
</section>

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）