How do I align a liquid element with the rest of the page?

Shopify Discussion

Topic summary

A user needed help aligning an embedded Bandcamp music player with the body text on their Shopify landing page. The player was displaying flush left without proper margins.

Technical Details:

  • The issue involved a Bandcamp iframe embed code
  • The player had width: 100% styling but lacked margin alignment
  • The goal was to match the alignment of other page elements below it

Resolution:
The issue was resolved successfully, though the specific solution provided by the community is not shown in the thread. The user confirmed the fix worked perfectly.

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

Hi community!

I’m trying to embed a player from Bandcamp on a landing page. The embed is working fine, however the player aligns to the left with no margin. How can I get it to align with the body text in the elements below?

The page is: https://www.richardandersson.dk/pages/grab-your-free-copy-of-the-six-of-us-by-richard-andersson-nor

And the embed code is:

<iframe style="border: 0; width: 100%; height: 120px;" src="https://bandcamp.com/EmbeddedPlayer/album=704906118/size=large/bgcol=ffffff/linkcol=0687f5/tracklist=false/artwork=small/transparent=true/" seamless=""><a href="https://richardandersson.bandcamp.com/album/the-six-of-us">The six of us by Richard Andersson NOR</a></iframe>

Thanks!

2

This works perfectly.
Thanks so much!