Formatting Tables In Pagebuilder For Mobile
Dina Abramson
Hi, I'm trying to format tables on a page and I can't get them to display properly on mobile
https://taxbuddies.ca/images/column_alignment-on-mobile.jpg
I used the table add-on in pagebuilder.
Can you please assist. The tables affected are payroll packages, Tax packages and business Services
Thanks.
Mehtaz Afsana Borsha
Accepted AnswerUse this custom CSS
@media only screen and (max-width: 844px){
.sppb-addon-table-main.bt tbody td::before, .sppb-addon-table-main.bt tfoot td::before, .sppb-addon-table-main.bt tfoot th::before {
width: 9em !important;
font-weight: 500 !important;
}
#sppb-addon-1683829018800 .sppb-addon-table-main.bt tbody td:before, #sppb-addon-1683829018800 .sppb-addon-table-main th {
word-wrap: break-word;
}
}
Path towards custom CSS: Extensions>Templates>Styles> Click on your current default template name then choose Template Options. Then find custom CSS within the custom code.
Mehtaz Afsana Borsha
Accepted AnswerHi
Thanks for contacting us. Could you please give me that specific page link?
-Regards.
Dina Abramson
Accepted AnswerDina Abramson
Accepted AnswerI'm sorry, but that did not impact the table at all. I have now separated the table into 3 columns but the table heading is repeating beside each row. I don't understand why it is not just displaying all the rows under the heading. Unless there is a setting I need to change.
Any assistance is appreciated.