Remove iFrame Border on Squarespace

When you add an iFrame to Squarespace, for some reason it automatically adds an annoying (and ugly) border around it. 

I can’t tell you how much this annoys me but luckily, with just a couple of lines of code, you can remove it.

Watch the video

Check out the YouTube video below 👇

To remove the iFrame border, head to Website > Website Tools > Custom CSS and in your custom CSS box, add the following code:

iframe {

border: none;

}

If you find that this doesn’t remove the border, simply add important to the code like below:

iframe {

border: none !important;

}

And that really is it. Hit save and you’ll have removed the ugly border from around the iFrame on your Squarespace website.


📩 Join the inner circle to get exclusive code updates


Be sure to check out my YouTube channel for more simple Squarespace hacks.


Your designer

I'm Sam, an award-winning Squarespace web designer. I have worked with every type of business, building platforms for solo entrepreneurs through to multi-million dollar corporations. If you want to discuss a potential project, you can email on sam@bycrawford.com or get in touch with me here. Alternatively, you can book in a free 15-minute consultation call here.


Want more?

Sam Crawford

This article was written by Sam Crawford, one of the world’s leading Squarespace website designers.

Sam is an official Squarespace Expert, official Squarespace Partner, official Squarespace Community Leader, official Squarespace blog contributor, official Squarespace panelist, Squarespace educator and multi-award winning Squarespace designer.

https://bycrawford.com
Previous
Previous

How To Enable Tablet View on Squarespace

Next
Next

How to Host Your Podcast on Squarespace