Link navigation to div ID within the same page

Hi guys,

I have a single page website and need to link the navigation to IDs in the page. I have different pages for each section, and am using the {{ get_content }} to pull the information in from each page and display it correctly within the single page. I want the user to be able to click on the link in the navigation and it skip down to the correct section.

Here is my current nav:

<div class="navlist">
    <ul class="mmenu">
        <li {{ if !segment_1 }}class="active"{{ endif }}><a href="/">Home</a></li>
        {{ nav from="/" max_depth="1" exclude="introduction" }}
        <li {{ if is_current }} class="active"{{ endif }}><a href="#">{{ title }}</a></li>
        {{ /nav }}

Then I have each section wrapped up in this tag:

{{ get_content from="/services" }}
    <div id="services">
                <!-- content from services in here -->
{{ /get_content }}

As you can see, at the moment, I have manually put in the correct ID of the section. How can I marry this up with the link in the <a> tag? Using #{{ title }} causes the link to have spaces and become broken. Is there another way to get the ID for the section and have this for the <a> link?

Thanks in advance for your help!

>>>>>>> Unanswered <<<<<<<
4 Replies