我目前正在NextJS中尝试样式化一个页面。我有一个图像在一个div中的锚中。我想调整图像的大小，但无论我怎么尝试，似乎都不起作用。
我试着将属性应用于所有三个元素，每个元素单独应用，一次两个。
相关代码：

<div className={styles.projectContainer}> 

            <div className={styles.projectDescriptionContainer}>
              <h3>Title</h3>
              <p>Lorem ipsum etc..</p>
            </div>

            <div className={styles.projectPhotoContainer}>
              <a className={styles.projectLink}
              href="heroku link"
              target="_blank">
              <img src='/local-file.png' />
              </a>
            </div>

          </div>

.projectContainer {
  display: inline-block;
  width: 100vw;
  height: 10vh;
}

.projectDescriptionContainer {
  display: inline-block;
  width: 20vw;
  height: 10vh;
}

.projectPhotoContainer {
  display: inline-block;
  width: 20vw;
  height: 20vh;
}

.projectLink {
  display: inline-block;
}

.img {
  object-fit: cover;
  width: 100%;
  height: auto;
}