I recently built a one-page index page using Bootstrap 4, complete with a navbar containing hyperlinks that smoothly navigate to different sections of the page. For example, the "Events" nav link takes users to the section identified by id="events".
<li class="nav-item"><a class="nav-link" href="#events">Events</a></li>
<div id="events" class="events-container section-container text-left vents px-md-5">
In another instance, I created a separate contact.php page with an identical navbar and linking system. However, when trying to link to specific sections on the index page from contact.php, it seems like the following code is not functioning as expected:
<li class="nav-item"><a class="nav-link" href="index.php#events">Events</a></li>
Unfortunately, clicking on these links does not lead to the desired sections on the index.php page. Instead, they all just redirect back to the main index.php page without scrolling to the intended section. If anyone has any insights or suggestions on how to resolve this issue, I would greatly appreciate your help.