Remove padding around video block

I have a 12 videos going 2x2 on my page, and would like the videos to have no space between them.  As if they were all stuck together. How would i make that possible?

If your site is on version 7.0, have you had a chance to check the Site Styles tweaks to reduce the spacing for your content? 

From the Home menu > Design > Site Styles 

I am on 7.1 

Can you share link to page where you use video blocks?

http://butterworthcollective.com/

When you scroll down, its the 14 videos I want to have no space between.  

8 hours ago, Rsfxm said:

http://butterworthcollective.com/

When you scroll down, its the 14 videos I want to have no space between.  

Add to Home > Design > Custom CSS

div#page-section-5eb2d5fa5e3a476e77792068 .video-block {
    padding: 0 !important;
}

Awesome. Thank you so much!!

Follow up question. Can I take the text below each of those videos, and have it on the video itself?

12 hours ago, Rsfxm said:

Follow up question. Can I take the text below each of those videos, and have it on the video itself?

Remove text? add this to Home > Design > Custom CSS

div#page-section-5eb2d5fa5e3a476e77792068 .video-block .video-caption {
    visibility: hidden;
}

Hi Guys!

I need help. I am uploading a video at 3840 × 1634 aspect ratio and Squarespace is creating me the white bars on the video block. Is there any chance on removing it so it would look way better in the page?

Thank you!

I am on 70.

On 3/9/2023 at 11:52 AM, KarlisVisuals said:

Hi Guys!

I need help. I am uploading a video at 3840 × 1634 aspect ratio and Squarespace is creating me the white bars on the video block. Is there any chance on removing it so it would look way better in the page?

Thank you!

What is Motion page url?

On 3/10/2023 at 7:40 PM, tuanphan said:

What is Motion page url?

Hi!

Thanks in advance! 

It is a video block, that seems to have 16:9 aspect ratio, however I exported the video in 2:35

https://www.karlisvisuals.com/motion

17 hours ago, KarlisVisuals said:

Hi!

Thanks in advance! 

It is a video block, that seems to have 16:9 aspect ratio, however I exported the video in 2:35

https://www.karlisvisuals.com/motion

Try adding to Design > Custom CSS

div#block-a7d8a96307186ea9b4b3 .sqs-native-video .native-video-player {
    padding-top: 45% !important;
    width: 100vw;
    left: 50%;
    transform: translateX(-50%);
}
body {
    overflow-x: hidden;
}

Hey @tuanphan, having this issue with videos on 7.0. I tried adapting what you wrote but I'm no coder and it doesn't seem to be doing anything:
 

div#collection-641c844c4e6aa16b06b34445 .video-block {
    padding: 0 !important;
}

Any help? For reference this is the page I'm working on: https://www.nickparente.work/the-furrow

Thanks for any help you can provide!

23 hours ago, NickParente said:

Hey @tuanphan, having this issue with videos on 7.0. I tried adapting what you wrote but I'm no coder and it doesn't seem to be doing anything:
 

div#collection-641c844c4e6aa16b06b34445 .video-block {
    padding: 0 !important;
}

 

Any help? For reference this is the page I'm working on: https://www.nickparente.work/the-furrow

 

Thanks for any help you can provide!

Try this

body#collection-641c844c4e6aa16b06b34445 .video-block {
    padding: 0 !important;
}

On 3/24/2023 at 7:32 PM, tuanphan said:

Try this

body#collection-641c844c4e6aa16b06b34445 .video-block {
    padding: 0 !important;
}

 

Hmm that didn't seem to work either. Attached an image of how I pasted the code- is this correct? 

On 3/26/2023 at 12:45 PM, NickParente said:

Hmm that didn't seem to work either. Attached an image of how I pasted the code- is this correct? 

Yes. Right. If it doesn't work, keep the code in CSS box and let me know, I can check it again easier

Hi @tuanphan this code didn't work for me... How can I make this a rule for the whole website to have 0 padding around the native video blocks.

Website https://shallot-octahedron-m3zj.squarespace.com/work/pauline-nguyen

Password BURO-EMMIKO

On 8/21/2023 at 1:09 PM, BUROM said:

Hi @tuanphan this code didn't work for me... How can I make this a rule for the whole website to have 0 padding around the native video blocks.

 

Website https://shallot-octahedron-m3zj.squarespace.com/work/pauline-nguyen

Password BURO-EMMIKO

 

 

That code for Classic Editor Section only, it won't work on Fluid Engine.

You mean reduce these space?

@tuanphan I actually refer to the padding that is visible when using the video blocks.  I want the video block to be perfectly aligned with the gallery sections below ( see images below for reference ) 

I did find a solution to work around this.. by using a new section  and set the background to video and set the setting to inset. However this does add extra whitespace at the bottom for this section. How can I remove/ reduced the highlighted section in blue? 

Hey folks

Been having a gander through the topic and I'm having similar issues to what some of the people here are having but not quite the same

Right now I have a video with a static image in it that I need to match up to an image block below. I can get pretty close but I can't get rid of the thin gap between the 2. Any ideas on how to get rid of this?

Using some of the advice given here, I've set the padding and margin for both image and video blocks to 0 (I think, my understanding of CSS is trash) but no joy. 

Any suggestions?

On 10/20/2023 at 4:37 AM, RossD said:

Hey folks

Been having a gander through the topic and I'm having similar issues to what some of the people here are having but not quite the same

Right now I have a video with a static image in it that I need to match up to an image block below. I can get pretty close but I can't get rid of the thin gap between the 2. Any ideas on how to get rid of this?

Using some of the advice given here, I've set the padding and margin for both image and video blocks to 0 (I think, my understanding of CSS is trash) but no joy. 

Any suggestions?

 

Can you share link to this page?

You can also consider using negative value, for example

margin-top: -10px !important;

(or margin-bottom)

Hi, I'm having trouble removing the padding from one of my video blocks. I copy pasted the code that you all suggested but it doesn't seem to be working. I want the edges of the video to be round and for that to work, I have to remove the padding. Could somebody please help?

On 3/6/2024 at 12:29 PM, WasteLess said:

Hi, I'm having trouble removing the padding from one of my video blocks. I copy pasted the code that you all suggested but it doesn't seem to be working. I want the edges of the video to be round and for that to work, I have to remove the padding. Could somebody please help?

 

Can you share link to this page? We can check easier