How to resize a rendered component in react

I have this component on a react website I am working on. Its an iframe generated using walls.io.

Wall

This is the code:

import React from 'react';
import './Home.css';

const Wall = ({src}) => {
    return (
        <div className='container'>
            <iframe
                className="responsive-iframe"
                allowFullScreen id="wallsio-iframe"
                src={src}
                loading="lazy"
                title="My social wall">
            </iframe>

        </div>
    );
}

export default Wall;

I want to resize this component and add it to a card component. But when I do that, I want the entire component itself to be resized (the images and the text should become smaller) instead of the component's dimensions being changed. This is the current state of the card :

Card

I want the entirety of the previous screen to fit inside this card. Is there any way to maybe "pre-render" a component or any other solutions? Thanks in advance. Apologies for the length of the question.