将子元素设置为父元素的 100% 宽度

我有一个主要元素，它分为 3 列网格。在中间一栏中，我显示了一些列表。每个列表都是一个 div 元素，里面有一个 react bootstrap 卡。

我试图让卡片覆盖 100% 的父对象，但这似乎对我不起作用。

反应组件

        <div className="backfill"> 
            <Row key={Listing_Id}>
                <Card style={{ cursor: 'pointer' }}  border="light" className="text-center fullCard" >
                    <Card.Body>
                        <Card.Title className="Title">
                            {Listing_Name}
                            <hr />
                            <Button className="Button" variant="outline-success" onClick={() => props.handleLikeDisLike(Listing_Id, 'Listing_Likes', Listing_Location)}> <Twemoji options={options} text=":+1:" /></Button>
                            <Badge className="Badge" variant="light">{Listing_Likes}</Badge>
                            <Button className="Button" variant="outline-danger" onClick={() => props.handleLikeDisLike(Listing_Id, 'Listing_DisLikes', Listing_Location)}><Twemoji options={options} text=":-1:" /></Button>
                            <Badge className="Badge" variant="light">{Listing_DisLikes}</Badge>
                            <hr />
                            <Button className="Button" variant="outline-info" ><Twemoji text=":pushpin:" /></Button>
                            <Badge className="Badge" variant="light">{Listing_Location}</Badge>
                        </Card.Title>
                        <Card.Text className="Listing" onClick={() => handleClick(Listing_Id)} >
                            <hr />
                            {ListingBody}
                            <ModalLayout
                                Listing_Location={Listing_Location}
                                Listing_Likes={Listing_Likes}
                                Listing_DisLikes={Listing_DisLikes}
                                Listing_Name={Listing_Name}
                                Listing_Id={Listing_Id}
                                handleLikeDisLike={props.handleLikeDisLike}
                                handleClose={closeModal}
                                show={showModal} />

                        </Card.Text>
                    </Card.Body>
                </Card>
            </Row>
            <br />
        </div >

div 和 Card 元素的 CSS

.backfill {
    background-color: aqua;
}

.fullCard {
    width:'100%';
}

我目前的用户界面看起来像这样。请你帮我解决这个问题。我想让卡片成为其父 div 的 100%。