Have you tried how the desktop view looks in a mobile? It isn’t that great in some mobiles.
Thank you for your reply.
I just tried on 2 iPhone and it was like this.
Which is exactly what I am looking for.
Ideally I would like that my users have this view directly without playing with the settings.
Disable your custom component. Create a new test component in mobile CSS try this
.category-box-heading h3 {
//* You may need to uncomment the 2 lines below.
// Overflow: unset !important;
// Text-overflow: unset !important;
text-wrap: balance !important;
}
I am pretty sure you will not need any other CSS modifications.
Just tested. Not working with my snippet either.
Latest version of effective code:
.full-width .contents .topic-list thead th.posts {
width: 10%;
}
.full-width .contents .topic-list thead th.activity {
width: 10%;
order: 4;
}
th.num.views {
width: 10%;
order: 3;
display: block;
}
.full-width .contents .topic-list tbody tr:not(.topic-list-item-separator) td.posts {
width: 10%;
order: 2;
}
.full-width .contents .topic-list tbody tr:not(.topic-list-item-separator) td.age {
width: 10%;
order: 4;
}
.topic-list .views {
width: 10% !important;
order: 3 !important;
display: flex !important;
visibility: visible !important;
justify-content: center;
}
.full-width .contents .topic-list tbody tr:not(.topic-list-item-separator) td.views {
width: 10% !important;
order: 3 !important;
display: flex !important;
justify-content: center;
align-items: center;
}
2 Likes