While working on my website, I noticed that the smooth-scroll feature works perfectly on desktop browsers. However, on mobile devices, when I click on a link, it does not scroll to the correct position. It always ends up much lower than expected. Any idea why this might be happening?
I have carefully checked the code and documentation of Smooth Scroll, but everything seems to be in order.
Here is the link to my code: https://codepen.io/ZeR0ByTe/pen/wrbMRZ
<!DOCTYPE html>
<html lang="es">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1, shrink-to-fit=no" name="viewport">
<!-- Bootstrap CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/font-awesome.min.css" rel="stylesheet">
... (other stylesheet links)
<script src="js/smooth-scroll.min.js"></script>
<script src="js/wow.min.js"></script>
... (other script tags)
</head>
... (body content)
</html>
-(Apologies for any language errors)
-(Please note that the tablet layout is still a work in progress)
Thank you!