Buy me a coffee

Decrease Space Above and Below List Carousel Section

#1. All Carousels

Use this code to Custom CSS box

/* Carousel Padding */
.user-items-list {
padding-top: 0px !important;
padding-bottom: 0px !important;
}

Decrease Space Above And Below List Carousel 01 Min

#2. Specific Carousel

First, you need to find the Carousel ID. In my example, it is:

section[data-section-id="6691fac7f5f20532008c4b08"]

Decrease Space Above And Below List Carousel 02 Min

Next, use CSS code like this

section[data-section-id="6691fac7f5f20532008c4b08"] .user-items-list {
padding-top: 0px !important;
padding-bottom: 0px !important;
}

#3. All Carousels on One Page

You need to find the Page ID. Use #2 tool. In my example, we have:

  • #collection-6691f8870a69e8146fbc79b6

Decrease Space Above And Below List Carousel 03 Min

So we will use CSS code like this:

#collection-6691f8870a69e8146fbc79b6 .user-items-list {
padding-top: 0px !important;
padding-bottom: 0px !important;
}

#4. Carousels on Desktop Only

Use this CSS code

@media screen and (min-width:768px) {
.user-items-list {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}
}

#5. Carousels on Mobile Only

Use this CSS code

@media screen and (max-width:767px) {
.user-items-list {
padding-top: 0px !important;
padding-bottom: 0px !important;
}
}