- This topic has 7 replies, 3 voices, and was last updated 7 years, 10 months ago by
.
Hello,
I am not able to make tables to be fully visible in a mobile view. I tried to adjust mobile padding options but it didn’t work. How can I make the whole table to be visible in a mobile view (without user scrolling to the right)?
Please see screen shots for reference.
Thank you in advance!
Hi there,
Can you please give us a link to this website page, so we can take a look? (you can post it in private field)
Best regards,
Shufflehound team
Hi,
Thanks for reply.
Please see information on the private field.
Your password for the shared page is not working for me so please make sure it is working by testing it yourself.
You can resolve it by adding the following CSS code in the Custom CSS code option of your theme on the below path.
Admin Area -> Appearance -> Theme Settings -> Custom Code -> CSS Code
.fw-table > table > thead > tr > th, .fw-table > table > tbody > tr > th, .fw-table > table > tfoot > tr > th, .fw-table > table > thead > tr > td, .fw-table > table > tbody > tr > td, .fw-table > table > tfoot > tr > td { white-space: normal; }Hi,
I tried to add the custom CSS code above to the theme settings but it seems not to be working. In the theme settings there is already a custom code used regarding tables (as there was a problem with them before > https://support.shufflehound.com/forums/topic/unable-to-remove-an-extra-3rd-column-in-tables/).
Could that earlier code have affect to this new one? Here is how the codes are currently inserted in the CSS code field:
.page-id-1595 .sh-table-element tr td.default-col:last-child {
display: none;
}
.fw-table > table > thead > tr > th,
.fw-table > table > tbody > tr > th,
.fw-table > table > tfoot > tr > th,
.fw-table > table > thead > tr > td,
.fw-table > table > tbody > tr > td,
.fw-table > table > tfoot > tr > td {
white-space: normal;
}Thank you in advance!
It seems facing CSS specificity issue so please try changing above shared CSS code with the following modified code.
.fw-table > table > thead > tr > th, .fw-table > table > tbody > tr > th, .fw-table > table > tfoot > tr > th, .fw-table > table > thead > tr > td, .fw-table > table > tbody > tr > td, .fw-table > table > tfoot > tr > td { white-space: normal !important; }
