مشکلات کیبر در css

سلام
در کد زیر چطور میتونم کیبرد رو بیارم روی صفحه؟ در حال حاضر وقتی توی حالت موبایلی کیبرد موبایل میاد بالا صفحه نصف میشه و میبرد روی صفحه html نمیاد

<div class="test">
  <input type="text">
</div>

.test{
    width: 100%;
    background: #b400ff;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 50%;
}