Klaviyo Reviews section not full width

Question

Hi guys, I can’t seem to get Klaviyo reviews to take full width on my Shopify product page on the desktop. It still looks narrow like it’s on mobile. I am using Horizon theme. My website is www.diosdubai.com

Could anyone suggest what to do?

StefanUE · Accepted Answer

Hey ​@LukaDiosthis might be a CSS styling issue on your website. Right now you have your flex-wrap set as “nowrap”, which is great, however it might be narrowing everything down to the size of that one review box you’re trying to display (so it’s shrinking the element box to just show that space).Instead, try using “wrap” and see what happens, or this CSS to force the block to take the entire row:shopify-block.shopify-app-block { flex: 1 1 100%; width: 100%; max-width: 100%;}#klaviyo-product-reviews-wrapper { width: 100%; max-width: 100%;}Either way, this looks like it’s your website CSS clashing with the Klaviyo reviews block’s instructions. You’ll have to tweak the code a bit until you find the right ratio.Let me know if this solved the problem!

DishaM13 · Answer

Good point about the CSS! One more thing to check: even if the Klaviyo block is set to 100%, it could still look narrow if the parent container has a fixed max-width. Using Inspect Element to check the parent section’s width or max-width might help. Adjusting that could solve the issue if the block changes alone don’t work.

Sign up

Use your Klaviyo credentials

Log in to the Community

Use your Klaviyo credentials