[Resolved] White Space on right side on Mobile Devices

[Alcides]

My Desktop version works beautiful. But issue comes on mobiles.

When i scroll down and drag any section of the website to the left there is an empty space on the right side of the website.
I have tried to modify the following classes to fix it on mobiles but it has not work so far
.container.grid-container{ width: 300px !important; }
body .grid-container{ max-width: 100% !important; }

Here are some screenshots about the issue for more clarification

View post on imgur.com

View post on imgur.com

[David]

Hi there,

you have a text widget that has this CSS applied to it:

#black-studio-tinymce-13 {
    width: 600px;
    margin-left: 40px;
    text-align: left;
}

Which is forcing the element to be 600px wide ….

[Alcides]

Hello, thank you for your answer. I removed the code you mentioned and it worked for a while but now i have the same issue again.

Can you please give me instructions of how you found the wrong code last time? So i don’t bother you again. thanks

[David]

This time it is the footer being sized to 100% by this CSS:

.footer-widgets{
	width: 100%;
}

This is a good article for finding overflowing elements:

https://css-tricks.com/findingfixing-unintended-body-overflow/

[Alcides]

Yeah this article is really good. Thank you for your help!

[David]

Happy to be of help

[piotr]

I have exactly the same problem as Alcides. But only on the Frontpage.
https://zwirgi.cf/

I am still going crazy looking for a solution.
Can you give me a little help?
Thanks

[Leo]

Can you open a new topic for your question?

Thanks 🙂

[Author]

Posts