Search code examples
markdownhtml-tag-details

Lists inside <details> tag in markdown file


I'm using Github pages to publish notes for my classes. I link from the main page (index.md), to other pages containing a list of links for the annotated version of the notes. I'm trying to simplify all the pages by using the <details> tag so that I can put ALL the links on one page while initially hiding the list. Below is an example of what my markdown code looks like:

[class1Notes.pdf](https://github.com/.../raw/main/class1Notes.pdf)

<details>
  <summary>class1 Annotated Notes</summary>
    
* [notes_1p1_annotated.pdf](https://github.com/.../raw/main/notes_1p1_annotated.pdf)

* [notes_1p2_annotated.pdf](https://github.com/.../raw/main/notes_1p2_annotated.pdf)
</details>

I'm using ReText to manually edit/preview the Markdown code in index.md, and it looks like this:

Screnshot of ReText

I also tried building the lists directly using HTML, but those did not look correct on the Github page. Am I using the <details> tag correctly, or am I completely misunderstanding how to use it?


Solution

  • I managed to solve my issue. I found this comment on an article about the on Github, and I now realize that Markdown doesn't work inside the <details> tag. Now I have:

    <h2> Class 1</h2>
    [class1Notes.pdf](https://github.com/.../raw/main/class1Notes.pdf)
    
    <details>
      <summary>class1 Annotated Notes</summary>
    <ul>
      <li><a href="https://github.com/.../raw/main/notes_1p1_annotated.pdf">notes_1p1_annotated.pdf</a></li>
      <li><a href="https://github.com/.../raw/main/notes_1p1_annotated.pdf">notes_1p2_annotated.pdf</a></li>
    </ul>
    
    </details>
    

    Which is correct!