link to another section on same page

Question

I have lets say 4 sections on my page. Each section has a dropdown arrow link which is placed in an <a></a> tag within the section tag <section></section> linking to each others id's.

For some reason my first dropdown tag is not working. I just cant explain why , what am i missing?

I felt like im miss spelling the id or incorrect placing of the a tag but all seems to look right, got me confused.

This is my code:

<section>

  <section id="home">
    <div>
      <section id="top">
        {content}
      </section>

      <a href="#section1" class="slidTonext"></a>

    </div>
  </section>

  <section id="section1">
    <div>
      <section id="mid">
        {content}
      </section>

      <a href="#section2" class="slidTonext"></a>

    </div>
  </section>

  <section id="section2">
    <div>
      <section id="bot">
        {content}
      </section>
    </div>
  </section>

</section>

For some reason href="#section1" is not working but then the section bellow href="#section2" does work. Confused, what can i be missing here?

Answer 1

Try changing the name of section1 to something else.