List with two columns

Ask the community
1

Has anyone figured out a smooth way to create a list with two columns?

Example screenshot:

image
image2372×852 229 KB

Thanks so much!

2

Code to be inserted in the header of the page where the list is

<style>
.css-8z1qu0 {
flex-basis: 50%!important;
max-width: 50%!important;
</style>

You need to change css-8z1qu0 by the card class of the corresponding list.

For example css-8z1qu0 is the class for the “List with vertical cards and tag” cards
css-1l6kpt7 is the class for the “List with small cards” cards (when set to 4 items per row)

That being said there might be some adjustements to make, the code sometimes work when you set, in the Softr studio, the number of items per row to 3, sometimes when it is set to 4 :man_shrugging:.

Two examples here: https://test-play.softr.app

In this page the code is

#list3 .css-1l6kpt7 {
 flex-basis: 50%!important;
 max-width: 50%!important;
}

#list4 .css-8z1qu0 {
 flex-basis: 50%!important;
 max-width: 50%!important;
}