Featured Reviews carousel not filling its section on Horizon
On Horizon based themes, the Featured Reviews carousel can sit in a section whose content alignment is set to flex-start. Horizon lays out that section as a flex container, and items in a flex container with start alignment are only as wide as their content instead of stretching across the section. The carousel works out its card widths from the space it is given, so it may not fill the section, or its cards may run past the edge of the screen on phones.
This is the same cause as Product Reviews block cut off on phones. Featured Reviews and Product Reviews are added to your theme the same way, so the same layout rule applies to both.
Try this CSS
Add this CSS in one of these places:
- Theme settings → Custom CSS, or
- The Custom CSS field on that section in the theme editor
.shopify-app-block:has(wise-featured-reviews) { width: 100%; max-width: 100%; min-width: 0; }
wise-featured-reviews { display: block; width: 100%; max-width: 100%; }
- Paste the CSS and save.
- Open the page with the carousel on your phone (or use a narrow preview, about 390px wide).
- Check that the carousel fills the section and the cards stay inside the screen.
Other ways to place the carousel
You can also add the carousel as its own Featured Reviews section, as described in Featured reviews, instead of placing it inside another section's content.
Widget look and feel settings: Customize the review widgets.
Still stuck? Message us from the chat widget and we'll help.