Embed components are not responsive to window size

Site URL: https://rachelskim.me/photography

Hi Everyone! I have a grid layout of some embed components on this page: rachelskim.me/photography. It is towards the bottom - they are instagram posts laid out in a 4x2 grid.

When on a larger desktop screen, the components are able to render perfect, but when on a smaller window size, they seem to overlap (see attachments).

Is there a way to have the embed components reduce in size to maintain the grid layout of them on the larger screen?

34 minutes ago, rsk17 said:

Site URL: https://rachelskim.me/photography

Hi Everyone! I have a grid layout of some embed components on this page: rachelskim.me/photography. It is towards the bottom - they are instagram posts laid out in a 4x2 grid.

 

When on a larger desktop screen, the components are able to render perfect, but when on a smaller window size, they seem to overlap (see attachments).

 

Is there a way to have the embed components reduce in size to maintain the grid layout of them on the larger screen?

What is your embed component provider? The element is an iframe therefore we did not have much control over its content

On 11/11/2021 at 12:04 PM, bangank36 said:

What is your embed component provider? The element is an iframe therefore we did not have much control over its content

Hi! I am currently just using Instagram's built-in embed option that is built in for each post.  I apologize for not being able to elaborate further... That being said, I’m open to trying other options to get a similar desired effect.

thank you!