El botón de cierre de Bootstrap Modal no funciona en pantallas más pequeñas

Para algunos modales, estoy usando un botón ‘x’ en la parte superior derecha de la pantalla para cerrar el modal. Si bien el botón funciona en dispositivos más grandes (cuando el ancho es> 768 píxeles), descubrí que el botón no funciona en dispositivos más pequeños (como en dispositivos móviles).

Este es el HTML que uso para el botón de cerrar, que obtuve directamente de la documentación de Bootstrap:

 

También agregué la clase close-btn para cambiar al tamaño de fuente a 2.5 em para hacerla más grande.

Edición: Aquí está el modal completo:

  

Añadir la etiqueta del botón dentro del cuerpo modal.

  

Aquí está el enlace codepen para referencia

https://codepen.io/chandrashekhar/pen/weBOvy?editors=1100

Espero que esto funcione..

Probablemente en pantallas pequeñas el botón está cubierto por otros elementos. Resuélvelo agregando un alto índice z:

  

CSS:

 .my-close{ z-index:999; }