Ширина и Высота не действуют при попытке изменить размер изображения внутри div

Question

Я пытаюсь изменить размер изображения внутри формы, но ширина и высота не дают никакого эффекта.

.sectionForm {
        display: table;
        margin: 0 auto;
        background: url("https://image.flaticon.com/icons/svg/1914/1914882.svg") no-repeat center center;
        width: 100px;
        height: 100px;
    }

.sectionForm {
  display: table;
  margin: 0 auto;
  background: url("https://image.flaticon.com/icons/svg/1914/1914882.svg") no-repeat center center;
  width: 100px;
  height: 100px;
}

.sectionForm form {
  width: 400px;
  box-shadow: 0px 4px 30px rgba(0, 0, 0, 0.2);
  border-radius: 40px;
}

.form-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 66px 0 50px 0;
}

footer {
  height: 1500px;
}

.footer-content {
  display: flex;
  flex-direction: column;
  display: table;
  margin: 0 auto;
}

.form-container input {
  border: none;
  border-bottom: 1px solid #828282;
  padding: 26px 0;
  margin-bottom: 100px;
  font-size: 20px;
  color: #4F4F4F;
}

<div class="sectionForm">
  <form>
    <div class="form-container">
      <input type="text" id="fname" name="fname" value="Nome">
      <input type="text" id="lname" name="lname" value="E-mail">
      <input type="text" id="lname" name="lname" value="Assunto">

    </div>
  </form>
</div>

Answer 1

В этом случае вам нужны не ширина и высота, а background-size.

Попробуйте использовать background-size: 100px 100px;, один для ширины, а другой для высоты. Вы также можете использовать проценты или background-size: cover и background-size: contain в зависимости от ваших потребностей.

Answer 2

Попробуйте использовать {

background-size: 100% auto;

}