Jump to content

Remove extra white space from video gallery

Go to solution Solved by tuanphan,

Recommended Posts

How can I  remove the extra space between the video and the text below it.  I've looked in chrome's inspector and saw the below but cannot figure out (a) how to target them correct and (b) if these are even the right ones.

video-gallery-main-content
lessons-list
lessons collection-content-wrapper lessons-list

I've tried putting dots before them and pudding padding in i.e., .video-gallery-main-content {padding: 0px;} or margin or line-height but i'm missing something.  

Can someone tell me what I am missing?  

I have my own domain so it may be under moetalks.com or moecritiques (which is what I originally used to sign up). PW 2024.  When I am editing i see the url in the photo.

2024-03-22_22-52-47.jpeg

Edited by MoeCritiques
add pw
Link to comment
  • Replies 8
  • Views 1.4k
  • Created
  • Last Reply

Top Posters In This Topic

I'm getting closer but I still cannot see what to target to get rid of all that space

I have my own domain so it may be under moetalks.com or moecritiques (which is what I originally used to sign up). PW 2024.  When I am editing i see the url in the first post i sent.

remove space.jpeg

Link to comment
On 3/26/2024 at 11:48 PM, MoeCritiques said:

Hi @tuanphan

moetalks.com or moecritiques (which is what I originally used to sign up). PW 2024. 

I've since cleaned up my css.  I'm getting closer.  Thanks for whatever help you can provide.

2024 is incorrect

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

@tuanphan

I finally got this @tuanphan.  The website is still open if you want to see.  

This code only worked when I was editing it.  Once I refreshed it even in the editor it did not work but as soon as I opened up CSS in design mode it worked.

[data-section-id="65dd51a68e3d9b0a3e68567a"] 
{
.lessons.collection-content-wrapper .nested-category-children {
    padding-bottom: 20px;
    padding-top: 0px;
    padding-left: 0;

}2024-03-29_12-01-45.thumb.jpeg.bb87459b82fd16c7a1829279e07f7308.jpeg

I went back to Chrome inspector and just copied out the whole code and pasted into CSS and just changed what I wanted and now it translates to other browsers.   Eventually I will come to understand why all the rest of it needed to be added in order for it to work.  @tuanphan You keep trying to help so please let me buy you a cup of coffee.  What is your link?

[data-section-id="65dd51a68e3d9b0a3e68567a"] 
{
.lessons.collection-content-wrapper .nested-category-children {
    padding-bottom: 20px;
    padding-top: 0px;
    padding-left: 0;
    margin-top: 0;
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-content: center;
    position: relative;
}
}
 

The photo on the right in the photo is the spacing I wanted and now it sticks.

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.