<form method="GET" action="arama.php" id="aramajs" data-ajax-form="true" data-before-callback="preventEmptySubmit">
        <input type="hidden" name="" value="1" id="f">
        <div class="arama-kutucu" id="anasayfa-arama-group">
                       
			
			<button class="arama-sil" aria-label="Search" type="button" tabindex="3" onclick="clearText();"><span class="btn-text sil">
             <i class="arama-buton"></i>
            </span></button>

            <button class="arama-yap" aria-label="Search" tabindex="1" type="submit"><span class="btn-text">
             <i class="sil-buton"></i>
            </span></button>
            </div>

    </form>

Merhabalar,
Mobil'de kullanıcılar arama yaparken arama kutucugu form'a tıklayınca direkt arama yapabiliyor. Bunda sorun yok. Ancak mobil'de klavye büyük olunca arama önerilerin yarısı klavye sebebi ile gözükmüyor.
Üstünde logo menü felan olunca bundan ötürü.
Ama verdiğim form html kodlara bunu yapabilir miyiz ?

Yapmak istediğim;
Form'a tıklanınca mobil'de direkt arama kutucu form'a otomatik inecek ve orada kalacak. Üst logomuz menüler gözükmeden direkt aşağı nasıl indirebiliriz. Yani menü logo gözükecek ancak, mobil cihazlarda tıklandığı an klavye ile arama kutucu form'a inerek nasıl yapabiliriz ?
Chrome gibi tarayıcılarda örnek olarak; ens üst kısma otomatik arama kutucugu forma getirecek ve arama yapılınca hemen form'un aşağıya öneriler çıkacak. Şu an çıkıyor ama yarısı gözükmüyor. İlla ekrana dokunarak indirmesi gerekiyor.

ÖRNEK RESİM: https://prnt.sc/5A11RxanR8bo
Burda arama kutucuğun üstünde logo var. Ama bu şekilde tıklandığı an direkt form'a indirmesini istiyorum.