Hello all, I am curious if someone can guide me on how I can set an iframe to full page width? When I adjust the width of the iframe manually it only extends to the right, but not the left of the screen. I don’t want any padding on either side, just the iframe to be full width of the page. Thanks!
Most probably, your iframe is inside a container element which has limited width and centred on the page.
in this case you can try these style rules on your iframe:
margin-left: calc(50% - 50vw);
width: 100vw;
But it would be best if you can share a (preview) link to the actual page you’re working on.
Thanks Tim, I tried inputting the code but no luck. Here is a link to the page https://968682.myshopify.com/. You can see iframe underneath the image banner. The site isnt live so not sure if you can view it. Let me know. Thanks a lot!
Anyone?
No, I can’t see it if it’s not published, You need to share either storefront password or preview link.
@tim_1 Hey Tim, here ya go. Thanks! https://9iy4vcpp2t2enjwx-77885407544.shopifypreview.com
It actually doesn’t even need to be full width, Just the width of the “featured products” at least.
link did not work ![]()
Hello @AboveTheSun ,
Please share the password of your store so we can check the issue. You can find the password by following the steps:
Go to Online Store → Preferences → Scroll to the Bottom of the page → Password protection.
Most probably, the iframe is not adapting to the full size of the screen width because it is inside a section that has page width or container class; either remove this class or share your password so that we can share a code for the same.
If you need more help on this, please let us know.
Regards,
CedCommerce
Hi @Cedcommerce thanks for replying. The password is tiewer. Looking forward to hearing back from you!