Return to previous page

Mobile width incorrect showing white space

This topic has 11 replies, 3 voices, and was last updated 6 months ago ago by Andrew Mitchell

Mario :)

Participant

September 23, 2024 at 01:39

Hi

When opening on mobile, it seems that the page doesn’t fit the screen and let the user scroll left<->right, showing a white space on the right.
And this issue happens on each pages.
Please check the screenshot and screen record in private content.

Best regards,
Mario 🙂

Please, contact administrator
for this information.

#415449 Copied Theme version: 9.4.1

10 Answers

Luca Rossi

Support staff

September 24, 2024 at 05:43

Dear Mario,

We hope this message finds you well. We kindly request your assistance in upgrading your Elementor plugin to the latest version. Should you encounter any issues post-upgrade, please consider temporarily removing all custom CSS codes and then re-evaluating the functionality.

Thank you for your attention to this matter. We look forward to your prompt response.

Best regards,
The 8Theme Team

#415596 Copied

Mario :)

Participant

September 26, 2024 at 03:20

Hi Luca,

I just did has you said previously but didn’t work.
Please check my website and do the necessary.

Regards,
Mario 🙂

#415876 Copied

Andrew Mitchell

Support staff

September 26, 2024 at 11:48

Hello Mario,

Thank you for following up. To resolve the issue with the white space on the right side of the page when viewed on mobile, here are a few things you can try:

1. Check the Custom CSS:
Sometimes custom CSS added to your theme can cause mobile width issues. Please review your custom CSS and remove or modify any styles related to page width, margins, or padding that might be affecting mobile views.

2. Viewport Meta Tag:
Ensure your website has the correct viewport meta tag in your header. It should look like this: <meta name="viewport" content="width=device-width, initial-scale=1">
This tag helps ensure the website is scaled correctly on mobile devices.

3. Test with Minimal Plugins and Themes:
If you have added custom plugins or custom code, temporarily disable them to check if they are causing the issue. Sometimes plugins or customizations can add unwanted padding or margins.

4. Elementor and Other Builders:
Since you’re using Elementor, update to the latest version if you haven’t already. Also, try removing custom widgets or settings that might cause layout shifts.

Please follow these steps and let me know if the white space persists. If needed, I can further check your site for you.

Best regards,
8Theme Support Team

#415943 Copied

Mario :)

Participant

September 26, 2024 at 12:49

Hi Andrew,

As I said previously,
1. Elementor is up to date
2. Removing CSS didn’t help
3. Please take a look on my website. Otherwise it is a waste of time for both of us. If you’ve checked at least the source code, you’ve noticed that the viewport tag is correct.

And, that issue is happening from the beginning. Which means, only installing Xstore theme and its required plugins (the minimum), followed by installing the demo.

Credentials are already in private.

Regards,
Mario 🙂

#415952 Copied

Luca Rossi

Support staff

September 27, 2024 at 08:41

Dear @Mario :),

We hope this message finds you well. We are writing to inform you that we have identified and resolved the issue concerning the footer menu on the mobile version of your website. It appears that the container was set to 115% width, which exceeded the optimal width for mobile screens.

We have adjusted this setting to ensure proper display, and as a result, the scrollbar issue has been resolved. Could you please review the changes at your earliest convenience to confirm that everything appears as expected on your end?

Thank you for your attention to this matter.

Best regards,
The 8Theme Team

#416060 Copied

Mario :)

Participant

September 27, 2024 at 09:13

Hi Luca,

Looks perfect now. Thank you.
How did you change the container size? Was it in one place or did you change for each of them?

Regards,
Mario 🙂

#416063 Copied

Luca Rossi

Support staff

September 27, 2024 at 09:30

Hi @Mario :),

We’ve added the custom CSS per each column. Please take a look at the screenshot:

https://prnt.sc/VrZ_ejp_SCw3

Best regards,
The 8Theme Team

#416069 Copied

Mario :)

Participant

September 27, 2024 at 10:36

Hi again Luca,

Does it mean that I’ll have to do the same every time I’ll add a new column and/or page?

Regards,
Mario 🙂

#416087 Copied

Luca Rossi

Support staff

September 28, 2024 at 09:39

Dear @Mario :),

We have noticed an issue that appears to occur when using the older sections of Elementor. We recommend transitioning to the new container model to enhance functionality and avoid any potential problems.

For detailed guidance on how to make this change, please visit: [https://elementor.com/help/convert-existing-sections-to-containers](https://elementor.com/help/convert-existing-sections-to-containers).

Best regards,
The 8Theme Team

#416194 Copied

Andrew Mitchell

Support staff

September 30, 2024 at 09:19

Dear Mario :),

Choosing our theme reflects your commitment to quality, and for that, we’re genuinely grateful. As we constantly strive to elevate your experience, your feedback is an invaluable gift. Could you kindly take a moment to rate our product with 5 stars on ThemeForest?

Click here to share your insights: https://themeforest.net/downloads

Your support fuels our journey, and we appreciate it more than words can express.

Best Regards,
The 8Theme Team

#416400 Copied
Tagged: correct white space woocommerce, fix mobile width woocommerce, mobile display issues woocommerce, resolve woocommerce theme problems, responsive woocommerce wordpress themes, woocommerce theme mobile optimization
Viewing 11 results - 1 through 11 (of 11 total)