- This topic has 14 replies, 2 voices, and was last updated 5 months, 2 weeks ago by
David.
-
AuthorPosts
-
August 4, 2020 at 9:38 pm #1387699
Rachel
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 #1387872David
StaffCustomer 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?Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/August 5, 2020 at 3:50 am #1387995Rachel
Hi 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 #1388003David
StaffCustomer SupportI am based in the UK.
Not seeing the signup pop-up.What i do see are these on iPhone 7+:
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/August 5, 2020 at 4:07 am #1388006Rachel
Interesting – 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 #1388079David
StaffCustomer 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; }
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/August 5, 2020 at 6:42 pm #1388874Rachel
Added 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 #1389258David
StaffCustomer SupportAah looking in the wrong place.
On the home page – the first container Block has the Wide Width option set. Can you remove that ?Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/August 6, 2020 at 4:20 am #1389280Rachel
Okay, 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 #1389281Rachel
Is the css I added for the box-sizing redundant or useful to retain?
August 6, 2020 at 4:33 am #1389287David
StaffCustomer 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.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/August 6, 2020 at 4:43 am #1389292Rachel
Ok 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 #1389293David
StaffCustomer SupportThats correct π
Glad to be of help.Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/August 6, 2020 at 4:52 am #1389297Rachel
THanks again – fantastic support, really appreciate it. Have a great day!
August 6, 2020 at 5:07 am #1389312David
StaffCustomer SupportYou too!
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/ -
AuthorPosts
- You must be logged in to reply to this topic.