Displaying dynamically created lists in different columns

Question

I have some list of vendors in my site, those vendors list are created manually.

Live Site

Those links are displaying in one single column div

Answer 1

Add display property:

.vendor-list-item {
  display: inline-block;
  width: 33%;
}

For mobile, use media queries:

@media (max-width: 480px){
  .vendor-list-item {
     width: 100%;
     text-align: center;
   }
}

You could also add a condition for tablets (<767px) to show in 2 columns (width: 50%).

Info about media queries: https://developer.mozilla.org/es/docs/CSS/Media_queries

Results