title: Not able to reduce the size of image in Material UI CardMedia in a React component
body: <p>I´m just not able to an image's heigh and width changed in Material-UI's <a href="https://material-ui.com/api/card-media/" rel="nofollow noreferrer">CardMedia</a> image: Below is my code.</p>
  
  <pre><code> &lt;Grid
      container
      spacing={36}
      direction="column"
      alignItems="center"
      justify="center"
      style={{
        minHeight: "100vh",
        backgroundImage: `url(${Image})`,
        height: "100%",
        backgroundPosition: "center",
        backgroundRepeat: "norepeat",
        backgroundSize: "cover"
      }}
    &gt;
      &lt;Paper style={{ height: "740px", width: "500px" }}&gt;
        &lt;Card className={classes.card}&gt;
          &lt;CardActionArea&gt;
            &lt;CardMedia
              style={{
                height: "40px",
                marginLeft: "113px",
                paddingLeft: "56.25%",
                paddingTop: "56.25%", // 16:9,
                marginTop: "20px",
                width: "30px"
              }}
              image={require("../../../Images/ApLogo/111.jpg")}
              title="Login"
            /&gt;
            &lt;CardTitle
              title="Log In"
              style={{
                marginLeft: "220px",
                marginTop: "10px",
                fontWeight: "bold"
              }}
            /&gt;
            &lt;CardContent&gt;
              ......
            &lt;/CardContent&gt;
          &lt;/CardActionArea&gt;
        &lt;/Card&gt;
      &lt;/Paper&gt;
    &lt;/Grid&gt;
  </code></pre>
  
  <p>I have looked throuh <a href="https://stackoverflow.com/questions/41772257/cardmedia-height-material-ui">this</a> and <a href="https://stackoverflow.com/questions/50272814/image-on-material-ui-cardmedia">this</a>. But none of which resolved my problem.</p>