Hello, as I work on my website with multiple pages, I am looking to implement smooth scrolling on a specific page without using the html tag for the entire site. Below is the code snippet I am working with:
{% if section.settings.display_product_detail_description == false and section.settings.display_product_reviews == false and section.settings.display_shipping_returns == false %}
{% assign tab5_active = true %}
{% endif %}
<div class="scroll-to-table">
<li class = "tab-title">
<a href="#product_attributes_table" class="tab-links {% if tab5_active %} active {% endif %}">
Specs
</a>
</li>
</div>
This snippet shows the HTML code I am dealing with
div.scroll-to-table{
scroll-behavior: smooth;}
Additionally, here is the CSS code associated with this implementation
Currently, the page only jumps instead of smoothly scrolling. I have attempted using ID instead of Class, .scroll-to-table instead of div.scroll-to-table, and modifying the element where the CSS is called from, but so far no success has been achieved