Responsive Web Design

<section>
  <div class="col">
    <h2>Solar System</h2>
    <p>
      The Solar System is the gravitationally bound system of the Sun and the objects that orbit it, either directly or indirectly.
    </p>
  </div>
  <div class="col">
    <h2>The Sun</h2>
    <p>
      The Sun is the star at the center of the Solar System. It is a nearly perfect sphere of hot plasma, heated to incandescence by nuclear fusion reactions in its core.
    </p>
  </div>
  <div class="col">
    <h2>Earth</h2>
    <p>
      Earth is the third planet from the Sun and the only astronomical object known to harbor and support life. About 29.2% of Earth's surface is land consisting of continents and islands.
    </p>
  </div>
</section>

section {
  display: flex;
}
.col {
  margin: 10px;
  padding: 5px 15px;
  background-color: #F1F5F9;
}

section {
  display: flex;
}
.col {
  margin: 10px;
  padding: 5px 15px;
  background-color: #F1F5F9;
}
@media screen and (max-width: 630px) {
  section {
    flex-direction: column;
  }
}