How to bring the image to the right of react Card - css

Question

I have a react Card.
I want to bring the image on the card to the right-side of card and it should also be parellel to the Name Pankaj Rout, and should be responsive.
This is what I have tried so far,
var userMap = [
{name: "Pankaj Rout", email: "pankaj.rout#somedomain.com"}
]
userData.map((data) => {
return (
<div key={data.email}>
<Card style={cardStyle}>
<Card.Body>
<div class="col-sm-6 text-right">
<img
className={classes.img}
style={cardImgStyle}
src="https://www.w3schools.com/howto/img_avatar.png"
alt="sans"
/>
</div>
<Card.Title> {data.name} </Card.Title>
<Card.Subtitle className="mb-2 text-muted">
General Manager
</Card.Subtitle>
<Card.Text> {data.email} </Card.Text>
<Button> Delete </Button>
<Button> Email </Button>
<Button> Chat </Button>
</Card.Body>
</Card>
</div>
);
classes is used from withStyles hook
const useStyles = (theme) => ({
img: {
justifyContent: 'right',
}
});
following style is referring to cardImgStyle
const cardImgStyle = {
width: "30%",
height: "30%",
borderRadius: "50%",
display: "flex",
flexWrap: "wrap",
};
Could anyone please point out what is wrong here?
Thanks!!

Answer 1

justifyContent : 'space-beetwin' ;
or
for img :
float :' right';