List with custom fields display inline

I am using the list style with the intro image, title, and 3 custom fields I would like them all to display inline. Currently the custom fields all display in one block. Can I do this ?

hi webiedesign

Yes but no, let me explain:

The Customfields are rendered in a table view (table>tbody>tr>td) by default a tr defines a row. So I've Quick tesetd it - just with CSS Classnames you cannot solve it. What you can do is:

​

Define a new Custom Class in the field "Customfields CSS Classes" (Module Backend) lets call it "inline-table".

​

In the next step you will need to create a bit of CSS Code in your templates "custom.css" (where to add this depends on your template):

.inline-table > tbody{
   display: flex;
   flex-direction: row;
}
.inline-table > tbody > *{
   padding:4px; /* Optional Add padding / margin to each item */
}

​

kind regards

​

Marco

This worked perfect ! Thank you.