When i view my site on ipad 3 i have a thick white stripe on the right. while content is still centered

Hi everyone
please see link:
http://illusive-technologies.webflow.com/
the site works well on mobile except on ipad. on the ipad i am getting all the sections bg not 100% width. the content is all the way but the sections are chopped on the right and i am getting a white space on the right which chops only background.
please notice i used 1170px divs instead of containers
everything works fine on desktop and smartphones. its just on ipad.

please help

I see it on iPad landscape and I can reproduce it on desktop with a certain browser size. You section “advanced attackers” seems to have a too much fixed width.

http://vincent.polenordstudio.fr/snap/dggjb.jpg

Could you share your public read-only link? (check on your site’s dashboard to generate it)

Also, there is a weird think happening on iPad portrait, on your hero section… do you see it?

yeah i noticed the astrix is hugh i try to fix it with no luck yet.

here is link
https://preview.webflow.com/preview/illusive-technologies?preview=ff3b8bc0233380a9ab8be5eaab92e7c4

please help. how could i fix this?

Hi @Tal_Shpon, sorry to hear about the layout trouble. It seems you have a fixed width of 1170px on the Slider Text Container class at Desktop mode. Ipad is still considered Desktop because it is 1024px and Desktop is anything over 992px.

First option is to remove the fixed width and use percentage based widths.

If you want to keep the fixed width, one thing you can try, is to add some custom css to target the media query when the viewport is 1024px and adjust the width of the Slider Text Container. You can try this by pasting the code below into the Header of your site:

<style>
@media (max-width: 1024px) {

	.slider-text-container {width: 1024px;}
	
}
</style>

Then save changes and republish and check how things look on ipad. I hope this helps, Cheers, Dave

Great!!!

i used your code and it worked! your the best!
also did the same for portrait at 768. and it worked also.
the only thing i cant figure out is the astrix image on the hero. when i am at portait mode in tablet it appears huge and pixlated.

why is that?

also i notices right now that it may appear well on ipad but mobile versions suddenly got the same problem ipad used to have with white stripe on the side

i kind of fixed it. but astrix on ipad portrait is looking huge

never mind. i found the problem. the image was on 80% width instead of auto

thank you for all your help

1 Like

No problem @Tal_Shpon, I am glad to be of help :smile:

Cheers, Dave