Product description spacing problem on mobile view

Store Design
, , ,

Topic summary

A user is embedding Facebook page feeds into product descriptions using custom HTML code. The feeds load automatically when clicking on product names.

The Issue:

  • Spacing between multiple Facebook feed embeds works correctly on desktop
  • On mobile view, the feeds appear compressed with no spacing between them

Technical Details:

  • Code is placed directly in the product description section via code editor
  • Multiple .fb-page div elements are contained within a parent #your-container-id div
  • Each embed uses Facebook’s standard iframe plugin with parameters like data-width="500" and data-height="500"

Current Status:
The discussion remains open with no solution provided yet. The user needs CSS adjustments that will add consistent spacing between feed embeds specifically for mobile viewports while maintaining the existing desktop layout.

Summarized with AI on November 8. AI used: claude-sonnet-4-5-20250929.
1

In my website I’m sourcing the product description from something like rss source/feed using the below code, so when you press on the product name the feeds start loading automatically replacing the usual product description
to do that that I put the code on the product description section in the code editor

the problem that I need to have equal spaces between loaded feeds so I added a piece of code for that within the main code and it worked well on desktop view but didn’t worked on the mobile view so the feeds on mobile appears closed to each other with no spaces at all

The code:

#your-container-id > *:not(:last-child) { margin-bottom: 50px; }

1.JPG
1.JPG357×605 21.2 KB

2.png
2.png357×672 103 KB