Задать стиль блоку из списка и кнопок

Как поместить блок из списка и двух кнопок в центр картинки на заднем фоне и сделать его возможным растягиваться под размер окнапояснение

div.butt {
  position: absolute;
  width: 304px;
  height: 335px;
  left: 868px;
  top: 397px;
}

input.myclass {
  color: 642f6b;
  font-family: Dosis;
  font-weight: bold;
  background-image: url(phon.png);
  background-size: auto;
  position: relative;
  left: 50%;
  transform: translate(-50%, 0);
}

button.trans {
  background-color: transparent;
  border: none;
  left: 0px;
  top: 291px;
}

ul {
  list-style-type: none;
}

img.centre {
  width: 100%;
  object-fit: cover;
}
<body>
  <img class="centre" src="centre.png">
  <div>
    <form enctype="multipart/form-data">
      <ul>
        <div class="butt">
          <li> <button class="trans" type="button "><img src="fa.png" ></button> </li>
          <li><img src="or.jpg"></li>
          <li><input class="myclass" type="text" placeholder="Email"></li>
          <li><input class="myclass" type="text" placeholder="Username" name="Username"></li>
          <li><input class="myclass" type="text" placeholder="Password"></li>
          <li><input class="myclass" type="text" placeholder="Confirm Password"></li>
          <li><button class="trans" type="submit"><img src="lets.png" ></button> </li>
        </div>

      </ul>
    </form>
  </div>
</body>


Ответы (0 шт):