Fixing formatting of carousel and text box on mobile

Builder content link: Builder.io: Drag and drop page builder and CMS

I have a few mobile formatting queries:

  • The carousel spacing is completely off on mobile - see screenshot. I’ve been playing around with the section, box, carousel, and image layers and can’t figure out why this is happening.
  • The text box below that say "Leopard Set - Midnight Jubilee (Navy) is overflowing on mobile. Also can’t figure out how to fix that.

Code stack you are integrating Builder with:
Shopify

Hi @niki!

The height of the carousel is off because your second slide has a fixed height of 730px. If you remove this value, the carousel should shink to fit its contents. If you give the “The Leopard set…” text a width of 100%, it shouldn’t overflow on mobile.

Thank you for your help, Maddy! That completely fixed “The Leopard Set” text box issue. It also improved the carousel issue, but there’s still a lot of spacing. Is there anything else you might be able to recommend for that?

@niki I’m also seeing 200px bottom padding on the second slide and a fixed height of 400px on some slides, removing this should help as well!

Hi Maddy, I’m not seeing that bottom padding or fixed height - I keep clicking each individual and then reviewing the “style” section to check the “Layout” and “Margin & Padding” areas. Are these values in some other section?

Here is a screenshot of where you can find the bottom padding, this is on the second slide (the box block)

Here is where you can find the fixed height, which I see on the all of the slides besides the first and second.

I see the issue now! I was clicking into the image layer instead of the carousel and box layer. Thank you very much for helping solve that!