This topic has 4 replies, 3 voices, and was last updated 2 months, 3 weeks ago ago by Andrew Mitchell
Hi! I’m trying to fix mobile responsive for compare page in my demo “Electronic mega market” because i think the “tds” in table are so big and they don’t let the content be seen as you can see in the screenshot.
Dear @Daniel,
I hope this message finds you well. We have identified that the responsive issue on the Compare page is due to the extended length of text in one of the table columns. This occurs because the browser settings for tables typically adjust all columns to match the width of the widest column.
To address this, we propose the following solutions:
1. Hide the label of the checkbox table column in responsive mode:
@media only screen and (max-width: 768px) {
td.xstore-compare-checkbox label {
display: none;
}
}
2. Decrease the size of labels in responsive mode:
@media only screen and (max-width: 768px) {
.xstore-compare-table td:first-child {
font-size: 12px;
}
}
3. Disable the sticky feature for the first table column in responsive mode:
@media only screen and (max-width: 768px) {
.xstore-compare-items td:first-child {
position: static;
}
}
Please implement any of the suggested solutions by adding them to the Theme Options under Theme Custom CSS -> Global CSS. Choose the option that best suits your needs.
Should you require further assistance or have any questions, please do not hesitate to contact us.
Best regards,
Jack Richardson
The 8Theme Team
Perfect!
Dear Daniel,
We trust our theme is enhancing your experience. Taking a brief moment to rate it with a glowing 5 stars on ThemeForest would be immensely appreciated. Your feedback holds significant value for us.
Click here to rate now: https://themeforest.net/downloads
Thank you sincerely for your ongoing support!
Best Regards,
The 8Theme Team
The issue related to '‘Trying to fix Mobile Responsive of compare page’' has been successfully resolved, and the topic is now closed for further responses