I suggest looking at other questions around getting lists to display horizontally first. Once that is complete you could apply the further styling.
See this topic for example.
Edit: Not sure why the above isn’t working for you, again, I suggest starting from aligning your entries before doing the rest of the styling
The below styling can be achieved with ease (I left the search field in as a proof of it being a list):
.mx-list .mx-listview-item {
flex: 1;
border: solid 1px #ccc;
text-align: center;
}
.mx-list {
display: flex;
}
Hope this helps
I’ve tired everything I found the forum, but so far, I haven’t been able to get them to be next to each other.