Reputation: 587
I am building a static page in .php
file with url http://example.com/support/test and after clicking on this link page is reloaded but does not scroll to the needed section. Here is the example code snippet:
<ul class="links">
<li>
<a href="#first">First</a>
</li>
<li>
<a href="#second">Second</a>
</li>
</ul>
<section>
<h3 id="first">First</h3>
</section>
<section>
<h3 id="second">Second</h3>
</section>
But instead of scrolling to the id browser reload the page with a link like that http://example.com/#first. What can be the problem and how can I solve this?
Thanks
Upvotes: 1
Views: 55
Reputation: 587
I found the issue. Link href should look like /support/test/#first
Upvotes: 1
Reputation: 1952
Becuase you dont have enough scroll in page, so you are seeing all in one page. You can check with scroll like:
<ul class="links">
<li>
<a href="#first">First</a>
</li>
<li>
<a href="#second">Second</a>
</li>
</ul>
<section>
<h3 id="first" style="height: 900px;">First</h3>
</section>
<section>
<h3 id="second" style="height: 900px;">Second</h3>
</section>
Upvotes: 0