[Share] Decrease Space Above and Below List Carousel Section

You can use these CSS code to Website Tools > Custom CSS to decrease space above/below List Carousel (or List Simple Grid).

#1. Space on All Carousels

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

#2. Space on Specific Carousel

First, you need to find the Carousel ID.

In my example, it is:

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

Next, use CSS code like this

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

#3. Space: All Carousels on One Page

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

#collection-6691f8870a69e8146fbc79b6

and we can use CSS like this

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

#4. Space on Desktop Only

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

#5. Space on Mobile only

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