SO-66564996

by David Thomas

HTML

<div class="footer">
      <h4>Kontakt</h4>
      <ul>
        <li>Mobilni: 062/329-077</li>
      </ul>
      
      <h4>Podaci</h4>
      <ul>
        <li>PIB: 112295370</li>
        <li>Matični broj: 66007057</li>
      </ul>
      <h4>Lokacija</h4>
      <ul>
        <li>Oslobođenja 32c, Rumenka</li>
      </ul>
      
</div>

CSS

/* a basic reset so that elements are sized, and
   spaced, consistently: */
*,
::before,
::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* removing all list-markers from the <ul> elements
   within the .footer element: */
.footer ul {
  list-style-type: none;
}

.footer {
  display: grid;
  /* because we're positioning the elements in pairs,
     one h4 to one ul, we use two rows and direct the
     layout to place elements in column direction
     instead of rows: */
  grid-template-rows: repeat(2, min-content);
  grid-auto-flow: column;
}