未应用网格间隙 - CSS 网格

/* services section */

.services {
  width: 90%;
  max-width: 1300px;
  margin: 15rem auto 5rem auto;
}

.services-card-wrapper {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  background: #f8f9fa;
}

<!-- Services Section -->
<section class="services">
  <div class="services-header">
    <h1>Our Services</h1>
    <p class="services-subtext">
      Our diverse range of services are designed to meet the unique needs of businesses and government agencies in Nigeria. Our expert consultants bring a wealth of experience to provide strategic solutions.
    </p>
  </div>
  <div class="services-card-wrapper">
    <div class="service-card">
      <img src="./images/wifi.svg" />
      <h2>Telecommunication</h2>
      <p>
        Stay connected and efficient with our telecommunication solutions. From infrastructure development to network optimization, we enhance your communication capabilities.
      </p>
    </div>
    <div class="service-card">
      <img src="./images/book-open.svg" />
      <h2>Specialist Training</h2>
      <p>
        Invest in your team's skills and knowledge. Our specialized training programs cover a wide range of topics, ensuring your workforce is equipped for the challenges of today and tomorrow.
      </p>
    </div>
    <div class="service-card">
      <img src="./images/users.svg" />
      <h2>Specialist Recruitment</h2>
      <p>
        Build a high-performing team with our specialist recruitment services. We identify and place top talent in your organization, matching skills and culture for long-term success.
      </p>
    </div>
  </div>
</section>