Hi everyone, long-time reader here and I’ve found many helpful resources on this forum! Now it’s time for me to ask a question
On my website I have interactive map embeds at the bottom of every gallery page to help display satellite imagery. These embeds aren’t scaling at all, so that causes issues on tablet and mobile. The standard options don’t seem to be working, so I wonder if it’s something in the HTML, or CSS?
It looks like you’ve embedded this inside of a rich text element which adds a few layers;
however the main issue appears to be the embedded content itself;
You’ll need to look at configuring the embedded content itself.
An IFRAME option might give you some embed code that you can responsify.
The rich text embed shouldn’t be a problem and I’m guessing you’ve done that because this code is being stored in the CMS.
Likely that’s not the core issue, however making this responsive involves investigating all of the layers.
desconstruct their embed code to see what responsive sizing options you have there
dig into the object it’s embedding to see where you’re having responsive issues
explore the docs and the system you’re using to see what configuration options you might have
talk to their support if you get stuck
I’m sure this isn’t a new problem, mobiles have been around for awhile, so you should find some docs or examples in the community for the product you’re using.
If you get stuck and need some pro help on this, you can DM me for rates.