- This topic has 14 replies, 2 voices, and was last updated 3 years, 7 months ago by David.
-
AuthorPosts
-
August 4, 2020 at 9:38 pm #1387699Rachel
Hi,
I have a mediavine GDPR cookie popup for European visitors to my site and also a sign-up pop up on my site. They work fine on desktop, but on mobile they are not centred – they are slightly cut off on the right hand side, obscuring the X to close.
My email provider has suggested it is an issue with iframes not being centred. I recently added custom CSS to force the sidebar to be a certain width until a mobile breakpoint, not sure if this would be causing the issue?
Are you able to confirm it isn’t an issue with Generatpress? I can send you a screen shot of the issue.
Thanks,
RachelAugust 5, 2020 at 1:47 am #1387872DavidStaffCustomer SupportHi there,
I can’t see that GP would do anything to interfere with a pop ups positioning.
Are you able to enable it on a staging server so i can see the actual issue?August 5, 2020 at 3:50 am #1387995RachelHi David,
I don’t have a staging server unfortunately..but going to the site on mobile should demonstrate the issue with my optin popup? ALternatively if you have a VPN and connect to France, you will see the cookie pop up.
I had assumed the issue was with the email provider, but when I saw the mediavine cookie pop up also has the same issue, I wonder if it is an issue with the mobile responsiveness some how.
Rachel
August 5, 2020 at 4:04 am #1388003DavidStaffCustomer SupportI am based in the UK.
Not seeing the signup pop-up.What i do see are these on iPhone 7+:
August 5, 2020 at 4:07 am #1388006RachelInteresting – so the cookies pop up is centred on your mobile, but not on mine (samsung S10 – android).
When I inspect the page and switch it to mobile view, it isn’t centred either. Confused…
Rachel
August 5, 2020 at 5:41 am #1388079DavidStaffCustomer SupportTricky especially when there is multiple pop ups.
Some elements have a width of 100% plus padding but no border-box: box-sizing CSS so they will break out of containment.Try adding this CSS to globally set that:
body * { box-sizing: border-box; }
August 5, 2020 at 6:42 pm #1388874RachelAdded the css but it doesn’t seem to have fixed the issue.
I recently removed Elementor and replaced it with Generateblocks on all pages. I thought I had set the pages to be full width, with the inner container the same for each.
If I enter the site on a post, the issue doesn’t occur – ie the pop up is centred, so it seems to only be an issue with the pages, so a problem with how I have added the containers..
I can actually shrink the screen manually and it resizes/centres but not ideal.
Rachel
August 6, 2020 at 3:44 am #1389258DavidStaffCustomer SupportAah looking in the wrong place.
On the home page – the first container Block has the Wide Width option set. Can you remove that ?August 6, 2020 at 4:20 am #1389280RachelOkay, so that seems to have fixed it. I don’t recall selecting the wide width – so not sure if it defaults to that? I also selected the option on the container settings on the right to make the container full width.
So why is the wide width setting causing the issue? When would you use a wide width setting?
Thanks.
August 6, 2020 at 4:20 am #1389281RachelIs the css I added for the box-sizing redundant or useful to retain?
August 6, 2020 at 4:33 am #1389287DavidStaffCustomer Supportthe Wide Width and Full Width options found in the Block toolbar are the hacky CSS method that core blocks use to make a block expand outside of a limited width container. So they are totally useless on full width containers.
They are not enabled by default but their UI is terrible so easily enabled without knowing it.
Unfortunately we’re having to conform with core blocks.Both use negative margins to make the element wider. In the case of alignwide those neg margins offset the Container padding – which isn’t present on a full-width-content page … hence the element ends up wider then the viewport.
We got some ideas on how to make it better so this kinda thing doesn’t happen ๐ And at the same time there is rumour that WP may drop this method as its prone to break stuff.
box-sizing shouldn’t be required now.
August 6, 2020 at 4:43 am #1389292RachelOk thanks. So when I create a page and add a new container, if i set the “Make page full-width” option on (in the block settings in the right panel) I shouldn’t then have to specify full width or wide width in the block options toolbar?
Thanks so much for your help, now need to check all the other pages..!
August 6, 2020 at 4:48 am #1389293DavidStaffCustomer SupportThats correct ๐
Glad to be of help.August 6, 2020 at 4:52 am #1389297RachelTHanks again – fantastic support, really appreciate it. Have a great day!
August 6, 2020 at 5:07 am #1389312DavidStaffCustomer SupportYou too!
-
AuthorPosts
- You must be logged in to reply to this topic.