Recaptcha messing up my web template by shifting it

AL911
2 Posts
AL911 posted this 22 September 2023
Ask a Question

The recaptcha badge icon is pushing my template left on mobile device which is throwing off my design as picture. It does not do this on laptop or other full screen devices. How do I fix this or some how make it floating so it doesn't impact the overall website.

From another forum post I found, I used this![enter image description here][1] in the Page Settings / CSS:

.grecaptcha-badge { visibility: hidden; }

And this was able to hide it from view but physically it is still there and thus continues to shift my template to the left.

https://i.imgur.com/kXZruaL.png

The recaptcha badge icon is pushing my template left on mobile device which is throwing off my design as picture. It does not do this on laptop or other full screen devices. How do I fix this or some how make it floating so it doesn't impact the overall website. From another forum post I found, I used this![enter image description here][1] in the Page Settings / CSS: .grecaptcha-badge { visibility: hidden; } And this was able to hide it from view but physically it is still there and thus continues to shift my template to the left. https://i.imgur.com/kXZruaL.png
Vote to pay developers attention to this features or issue.
2 Replies
Order By: Standard | Newest
AL911
2 Posts
AL911 posted this 22 September 2023

Attached screenshot

Attached screenshot
Support Team
Support Team posted this 23 September 2023

Hello Andrew,

Thanks for using Nicepage!

You are right, the visibility: hidden sets the element to hide, but the element (aspect) is still live on the website, The place of the element for example 100px X 200px still will be on the website.

Instead of this, you can try display: none; the display none gives the result that the element disappears with its place, and the element dies by this CSS.

If this can not give you a good result, you can try this:
visibility: hidden;
width: 0;
height: 0;

Please let us know if you have any further questions.
...................................................
Sincerely,
George.
Nicepage Support Team

Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1
Follow us on Facebook: http://facebook.com/nicepageapp

Hello Andrew, Thanks for using Nicepage! You are right, the **visibility: hidden** sets the element to hide, but the element (aspect) is still live on the website, The place of the element for example 100px X 200px still will be on the website. Instead of this, you can try **display: none**; the display none gives the result that the element disappears with its place, and the element dies by this CSS. If this can not give you a good result, you can try this: **visibility: hidden; width: 0; height: 0;** Please let us know if you have any further questions. ................................................... Sincerely, George. Nicepage Support Team Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1 Follow us on Facebook: http://facebook.com/nicepageapp
You must log in or register to leave comments