HTML-Links nicht angeklickt werden auf mobilen, aber sind anklickbar auf Desktop

Question

ich Probleme mit zwei Tasten an der Spitze meiner mobilen Website www.thefriendlydentist.ie

Sie sind anklickbar auf dem Desktop, sondern auf Handy habe ich keine Antwort?

Der HTML-Code wird in die Kopfzeile des WP-Themas eingefügt.

<div id="topcontact-2" style="background-color:white;"> 
<a href="tel:012863787"><p style="background-color:white;padding:none;"class="call-button" id="call-button"> CALL US </p> </a> 
<a href="mailto:info@thefriendlydentist.ie"> <p style="background-color:white;padding:none;" class="call-button" id="email-button"> EMAIL US </p> </a> 

</div> 

Answer 1

den Codeblock unten oder Display entfernen: versteckt auf Handy in Ihrem Thema.

Wenn Sie im Desktop-Browser über die Symbolleiste des mobilen Geräts suchen, sehen Sie, dass diese Elemente die gesamte Seite ausfüllen, sodass Ihre Schaltflächen hinter ihnen bleiben.

<div class="mobile-bg-fix-img-wrap"> 
    <div class="mobile-bg-fix-img" style="/* width: 375px; *//* height: 767px; */"></div> 
</div> 

Sie können in Bild sehen, wie oben Elemente die Seite füllen.

Answer 2

Bitte gehen Sie in Ihr CSS und nehmen Sie diese Änderung vor.

.mobile-bg-fix-wrap .mobile-bg-fix-img { 
position: absolute; 
width: 100%; 
height: 125%; 
left: 0; 
top: 0; 
background-size: cover; 
} 

An:

.mobile-bg-fix-wrap .mobile-bg-fix-img { 
position: absolute; 
width: 100%; 
height: 125%; 
background-size: cover; 
} 

oberen und linken auf 0 wurde die Überlappung der beiden Tasten eingestellt verursacht es, dass Sie nicht darauf klicken können.