Google form not centered on Mobile View

Eweisfeld
Tourist
11 0 3

Hi! I cannot get my iframed google form to be centered on mobile view. It is centered on desktop. Code:

<div><meta charset="utf-8" /><img src="https://cdn.shopify.com/s/files/1/0457/4471/7981/files/Screen_Shot_2021-02-11_at_4.56.22_PM_480x480...." alt="" width="451" height="134" style="display: block; margin-left: auto; margin-right: auto;" /> </div>
<div style="text-align: center;"><iframe src="https://docs.google.com/forms/d/e/1FAIpQLScMY6W8O7aPRUKV0PQaFgUzijbMoraA1vJQ_Cx5RxKztzFY5A/viewform?..." width="640" height="1356" frameborder="0" marginheight="0" marginwidth="0">Loading…</iframe></div>

Screen Shot 2021-02-16 at 8.21.09 AM.png

 ^^ Desktop View

IMG_5090.jpeg

^ ^ Mobile View

 

I've tried changing the float to left and text to left, but hasnt helped...

Replies 8 (8)

dmwwebartisan
Shopify Partner
12274 2546 3692

@Eweisfeld 

Please share your website URL and password if any. I will check and provide a solution here.

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app
Eweisfeld
Tourist
11 0 3
resmrkt.com thanks!
dmwwebartisan
Shopify Partner
12274 2546 3692

@Eweisfeld 

Please add the following code at the bottom of your assets/theme.scss.liquid file

iframe{ width: 100%; height: auto }

Hope this helps.

Thanks! 

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app
Eweisfeld
Tourist
11 0 3

It worked! Thanks!

dmwwebartisan
Shopify Partner
12274 2546 3692

@Eweisfeld 

Please accept as a solution so others can take benefits.

 

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app
mabootle
Visitor
2 0 1

I added the code iframe{ width: 100%; height: auto } at the bottom of my Assets/theme.scss.liquid

It worked, but now I have to scroll through the Google form as it's embedded (very small) instead of just scrolling down on the page.

FBAeSales
Visitor
1 0 0

Hi Dmwwebartian, I'm having the same issue with my dawn theme but I couldn't find where in the coding files. Could you please help me?

Thanks 

michael-helium
Shopify Expert
358 5 176

Why force a Google Form to work on your Shopify site when plenty of Shopify Form apps do all of the same stuff?

 

Looking for a free alternative? Use Shopify forms.
Need more customization? Use Helium Customer Fields. The data is saved to a customer record in Shopify, including custom fields (as customer metafields).

Or use Google Forms. Then later on when your brand is growing you'll have to untangle the web of non-Shopify apps you've strung together. 

 

Using a Google Form on your Shopify store is the wrong move. Full stop.
You're building a Shopify brand, so build on Shopify. Not Google.

Michael, COO @ Helium
- Customer Fields ✪✪✪✪✪ (346 reviews)
- Meteor Mega Menu ✪✪✪✪✪ (265 reviews)