Make a good look grid table

is it possible to make the following page which showing the grid table nicely ?

https://www.hktutor.hk/tutor.php

Using the pdf_list as this at the page: [pdb_list template=flexbox fields=”first_name,last_name,city,state” class=”pdb-list-grid”]

I added the Custom CSS to the “Custom Plugin Stylesheet” under participant database.
/*
Stylesheet for setting up a CSS grid layout for the
Participants Database responsive list display
*/

/* this is to hide unneeded elements */
.pdb-list-grid .pdb-field-title,
.pdb-list-grid h5 {
display: grid;
}

/* sets up the grid container */
.pdb-list-grid .list-container {
display: grid;
/* sets up the columns: here we set up 3 equal columns */
grid-template-columns: 1fr 1fr 1fr;
/* this defines the amount of space between the elements */
grid-gap: 2.5em 2.5%;
}

/* this styles each record section */
.pdb-list-grid section {
/* don’t need margins, the grid does this for us */
margin: 0;
}

/* make the data fields sit next to each other */
.pdb-list-grid .pdb-field {
float: left;
margin-right: 1ex;
}

/* this makes the 4th field start on a new line */
.pdb-list-grid .pdb-field:nth-child(4) {
clear: left;
}

/* this styles the photo field */
.pdb-list-grid .pdb-field:first-child {
margin: 0;
overflow: hidden;
}

/* sets the size of the image element */
.pdb-list-grid .pdbiex-image-field-wrap,
.pdb-list-grid .image-field-wrap img {
width: 100%;
height: auto;
}