My experience with Bootstrap 4 has been somewhat puzzling as the scroll to div functionality seems to be working only on mobile phones or smaller screens.
Below is the Javascript code I am using:
<script>
$(".navbar-nav li a").click(function(event) {
if (!$(this).parent().hasClass('dropdown'))
$(".navbar-collapse").collapse('hide');
}); </script>
The navbar link in question:
<li class="nav-item">
<a class="nav-link" href="#about-us"><button type="button" class="btn btn-green">About</button></a>
</li>
And here's the specific div element I'm trying to scroll to:
<div class="about" id="about-us">
<div class="container">
test
</div>
</div>