Having trouble with adding an accordion :S

[Aliana]

URL: thedasandbeyond.com/board/32/character-creation 

I was starting to input some code for an accordion and for some reason the first 3 accordions work and then the last 2 don't open at all - rather the 3rd accordion keeps opening if I click on the last 2. I can't figure out the problem.

Here's the code I used:



<a name="GettingStarted"></a>
<div id="container">
 <div class="accordion">
   <label for="tm" class="accordionitem"><h2>1. Getting Started <span class="arrow">&raquo;</span></h2></label>
   <input type="checkbox" id="tm"/>
   <p class="hiddentext">We highly recommend that you are already familiar with the Dragon Age series prior to playing our game, as we do incorporate a lot of canon resources from the video games, comic books, and even the official tabletop rpgs.</p>
</div>
 
<a name="Canons"></a>
 <div class="accordion">
   <label for="tn" class="accordionitem"><h2>1.1. Playing A Canon <span class="arrow">&raquo;</span></h2></label>
   <input type="checkbox" id="tn"/>
   <p class="hiddentext">The Dragon Age universe is vast, as such there's a ton of canons to consider—<i>many of which don't even have detailed backgrounds</i> so it would be entirely up to the adopter to create a rich history for them. This includes canon characters mentioned but never actually seen, like those referenced in Dragon Age: Inquisition’s <a href="https://dragonage.fandom.com/wiki/War_table" target="_blank">"War Table"</a> missions.
<br></br>
We’ve compiled a <a href="http://thedasandbeyond.com/page/canons" target="_blank">Canons List</a> of just <i>some</i> of the available canons. In reality, between the games, the comics, and the novels, the full list is too long. If you’re looking for a really obscure character, we may not have thought to add it. That said, major canons who are absent from our list are, as a general rule of thumb, considered deceased (though some might be NPCs). If you’re unsure, you can ask us about it in <a href="http://thedasandbeyond.com/board/25/canon-lore" target="_blank">Questions About Canon Lore</a>.
<br></br>
Major canons cannot be retired, even if a player leaves the game—when that happens, the canon is made re-available for adoption. However, all prior in-game decisions, contributions, etc. made by that canon’s prior player will remain as part of our own game’s canon going forward, even if someone else does decide to take up the mantle.
<br></br>
Minor canons are generally first come, first serve. For major canons—like the companions of Origins, DA2, or the Inquisition—preference will be given to players who’ve been contributing on our game board for at least a few months. Occasionally, we recruit externally for major canons as well should the need arise plot-wise.
<br></br>
Players interested in canons are still required to fill out a <a href="#Form">Character Application Form</a>, and their profiles will still be subject to our game's regular approval process. Please don’t just copy canon character backgrounds from external resources like the <a href="https://dragonage.fandom.com/wiki/Dragon_Age_Wiki" target="_blank">Dragon Age Wiki</a> (which we are not directly affiliated with, but you can use their Wiki as a research resource—do NOT post your character profiles there). What we’re looking for in your canon profile is, really, a number factors among which is your writing ability (including grammar) and whether or not you can capture the tone of said canon.
<br></br>
If you’re filling out an application for a canon that hasn’t been adopted previously, that profile will set the standard for that canon going forward—even if you leave the game later on.</p>
 </div>

<a name="Responsibilities"></a>
<div class="accordion">
   <label for="to" class="accordionitem"><h2>1.1.1. Canon Responsibilities <span class="arrow">&raquo;</span></h2></label>
   <input type="checkbox" id="to"/>
   <p class="hiddentext"><b>1.</b> Players with canon characters are <b>required</b> to post as said canon a minimum of 4 posts (not threads, but each post should be in a different thread) per month. This applies to each canon character under a player’s control. Failure to meet this expectation will initially result in a warning, while repeat offenders will have said canon removed from their personal roster by <a href="http://thedasandbeyond.com/user/1">Administration</a> so that it can be re-listed for adoption.
<br />
<b>2.</b> Solo threads do not count toward the monthly minimum requirements for posting, the required 4 posts must to be in threads with other players.
<br />
<b>3.</b> Players with canon characters cannot turn down thread requests from other players without justifiable cause or explanation such as:
<br />
◦ The canon character is in a different kingdom, city, etc. thus making it somehow implausible because… oceans, etc.
<br />
◦ The canon character is already in 10 separate threads (we don’t want to overload players).
<br />
◦ The canon character is unavailable on a  specific in-game date (via the <a href="http://thedasandbeyond.com/board/35/calendar-system" target="_blank">Chantry Calendar</a> because they’re already in a thread at that time).
<br />
<b>4.</b> Players with canons must lead by example in threading with other players. Canon-holding players solo threading a canon with one of their own original characters, without other players involved, is not allowed—remember this is a roleplaying <i>community</i>, not a fanfic one. Collaboration is key. Major canons, or those with high social ranks (monarchs, military leaders, etc.), should be active on the boards, leading small plots, and encouraging fellow players to join threads.
<br />
<b>5.</b> Canon characters must make an effort to engage with non-canon characters. Do not ignore OCs in favour of other canons.
<br />
<b>6.</b> Exceptions will be made, concerning the above, on a case by case basis at <a href="http://thedasandbeyond.com/user/1">Administration's</a> discretion.</p></div>

<a name="Reserved"></a>
<div class="accordion">
   <label for="to" class="accordionitem"><h2>1.1.2. Reserved Canons <span class="arrow">&raquo;</span></h2></label>
   <input type="checkbox" id="to"/>
   <p class="hiddentext">If a canon is listed as reserved, it means they're either currently being applied for by another player and/or an administrator or moderator has requested they be set aside for a future plot. You cannot apply for reserved characters. Some canon characters are listed as “Mods Only”, that is because the canon in question is probably in-game leadership (which requires some OOC leadership in turn).
<br />
Spirit Warrior is a Warrior specialization exclusive to staff, and even then it will only be allowed in rare instances. We can’t have a dozen Kristoff/Justice’s running around all at once. That’s too much of a narrative free-for-all.
<br />
Blood Mages are similarly reserved albeit non-staff who've shown their abilitiy as fair and balanced players in-game will be allowed to apply for this specialization for their second, third, etc. once their probabtion period is over. Blood Mages are also restricted to Apostates, specifically—in our game, Circle Mages cannot be Blood Mages (the Templars would've found out and killed them). A former Circle Mage-turned-Apostate is allowed, however.</p></div>

<a name="Unplayable"></a>
<div class="accordion">
   <label for="to" class="accordionitem"><h2>1.1.3. Unplayable Canons <span class="arrow">&raquo;</span></h2></label>
   <input type="checkbox" id="to"/>
   <p class="hiddentext">Some canon characters are simply too powerful to allow for fair gameplay. Shapeshifters like Flemeth or Morrigan won’t be allowed, and God-like or Old God characters like Flemeth or Solas <i>definitely</i> won’t be allowed in our game. We may use Solas as an NPC in the distant future, following the release of the next Dragon Age installation. As of right now, we’re considering Solas MIA.
<br></br>
Non-Dragon Age characters from other video games, comics, books, or movies are not permitted. You can only play an entirely original character of your own crafting or a Dragon Age canon character. Moreover, the <a href="http://thedasandbeyond.com/board/357/codex-races-thedas" target="_blank">Races</a> in our game are canon to the Dragon Age universe as well—as such we will never allow other random or mythical creatures in our game (i.e. no anthropomorphic races, no vampires, no hobbits, etc.).
<br></br>
Darkspawn, Demons, and Spirits of the Fade are not allowed to be applied for, either, as they’re entirely NPCs in our game. Cole is somewhat of an exception because we’ve “made him more human” (plus, he’s an adorable cinnamon roll).</p>
 </div>


[Scott]

Aliana, at first glance just skimming the code, I don't see a closing </div> at the end for the opening <div id="container">. Unless it just wasn't included in what you copied and pasted above?

[Aliana]

Feb 8, 2019 5:01:00 GMT -8 Scott said:

Aliana , at first glance just skimming the code, I don't see a closing </div> at the end for the opening <div id="container">. Unless it just wasn't included in what you copied and pasted above?

I omitted some of the code for the page overall because I wanted to exclude the Table of Contents stuff.

But here's everything...



<div class="container boards">
<div class="title-bar bbcode"><h2><div class="title_wrapper">Character Creation</div></h2></div>
<div class="content cap-bottom" style="padding:50px;">
<a name="ToC"></a>
<h3>Table of Contents</h3>
<p><a href="#GettingStarted">1. Getting Started</a>
<p><a href="#Canons"><p style="margin-left: 20px">1.1 Playing A Canon Character</a>
<p><a href="#Responsibilities"><p style="margin-left: 40px">1.1.1 Canon Responsibilities</a>
<p><a href="#Reserved"><p style="margin-left: 40px">1.1.2 Reserved Canons</a>
<p><a href="#Unplayable"><p style="margin-left: 40px">1.1.3 Unplayable Canons</a>
<p><a href="#OCs"><p style="margin-left: 20px">1.2 Playing An Original Character</a>
<p><a href="#Names"><p style="margin-left: 40px">1.2.1 Naming Your OC</a>
<p><a href="#Personalities"><p style="margin-left: 20px">1.3 Character Personalites</a>
<p><a href="#Origins"><p style="margin-left: 20px">1.4 Character Origins</a>
<p><a href="#SocialClass"><p style="margin-left: 40px">1.4.1 Social Class</a>
<p><a href="#CombatClass"><p style="margin-left: 40px">1.4.2 Combat Class</a>
<p><a href="#Avatars"><p style="margin-left: 20px">1.5 Character Avatars</a>
<p><a href="#Skills">2. Skills & Specializations</a>
<p><a href="#Points"><p style="margin-left: 20px">2.1 Starting Points System</a>
<p><a href="#Advancements"><p style="margin-left: 20px">2.2 Advancements & Points Restrictions</a>
<p><a href="#Tabs"><p style="margin-left: 20px">2.3 Skills Table</a>
<p><a href="#Factions">3. Starting Factions</a>
<p><a href="#Applications">4. Filling Out An Application</a>
<p><a href="#Form"><p style="margin-left: 20px">4.1 Character Application Form</a>
<p><a href="#Submit"><p style="margin-left: 20px">4.2 Submit Your Application</a>
<p><a href="#Approval"><p style="margin-left: 20px">4.3 Approval Process</a>
<p><a href="#AdditionalCharacters">5. Applying For Additional Characters</a>
<p><a href="#Modifications">6. Character Profile Modifications</a>
<hr>
<a name="GettingStarted"></a>
<div id="container">
 <div class="accordion">
   <label for="tm" class="accordionitem"><h2>1. Getting Started <span class="arrow">&raquo;</span></h2></label>
   <input type="checkbox" id="tm"/>
   <p class="hiddentext">We highly recommend that you are already familiar with the Dragon Age series prior to playing our game, as we do incorporate a lot of canon resources from the video games, comic books, and even the official tabletop rpgs.</p>
</div>
 
<a name="Canons"></a>
 <div class="accordion">
   <label for="tn" class="accordionitem"><h2>1.1. Playing A Canon <span class="arrow">&raquo;</span></h2></label>
   <input type="checkbox" id="tn"/>
   <p class="hiddentext">The Dragon Age universe is vast, as such there's a ton of canons to consider—<i>many of which don't even have detailed backgrounds</i> so it would be entirely up to the adopter to create a rich history for them. This includes canon characters mentioned but never actually seen, like those referenced in Dragon Age: Inquisition’s <a href="https://dragonage.fandom.com/wiki/War_table" target="_blank">"War Table"</a> missions.
<br></br>
We’ve compiled a <a href="http://thedasandbeyond.com/page/canons" target="_blank">Canons List</a> of just <i>some</i> of the available canons. In reality, between the games, the comics, and the novels, the full list is too long. If you’re looking for a really obscure character, we may not have thought to add it. That said, major canons who are absent from our list are, as a general rule of thumb, considered deceased (though some might be NPCs). If you’re unsure, you can ask us about it in <a href="http://thedasandbeyond.com/board/25/canon-lore" target="_blank">Questions About Canon Lore</a>.
<br></br>
Major canons cannot be retired, even if a player leaves the game—when that happens, the canon is made re-available for adoption. However, all prior in-game decisions, contributions, etc. made by that canon’s prior player will remain as part of our own game’s canon going forward, even if someone else does decide to take up the mantle.
<br></br>
Minor canons are generally first come, first serve. For major canons—like the companions of Origins, DA2, or the Inquisition—preference will be given to players who’ve been contributing on our game board for at least a few months. Occasionally, we recruit externally for major canons as well should the need arise plot-wise.
<br></br>
Players interested in canons are still required to fill out a <a href="#Form">Character Application Form</a>, and their profiles will still be subject to our game's regular approval process. Please don’t just copy canon character backgrounds from external resources like the <a href="https://dragonage.fandom.com/wiki/Dragon_Age_Wiki" target="_blank">Dragon Age Wiki</a> (which we are not directly affiliated with, but you can use their Wiki as a research resource—do NOT post your character profiles there). What we’re looking for in your canon profile is, really, a number factors among which is your writing ability (including grammar) and whether or not you can capture the tone of said canon.
<br></br>
If you’re filling out an application for a canon that hasn’t been adopted previously, that profile will set the standard for that canon going forward—even if you leave the game later on.</p>
 </div>

<a name="Responsibilities"></a>
<div class="accordion">
   <label for="to" class="accordionitem"><h2>1.1.1. Canon Responsibilities <span class="arrow">&raquo;</span></h2></label>
   <input type="checkbox" id="to"/>
   <p class="hiddentext"><b>1.</b> Players with canon characters are <b>required</b> to post as said canon a minimum of 4 posts (not threads, but each post should be in a different thread) per month. This applies to each canon character under a player’s control. Failure to meet this expectation will initially result in a warning, while repeat offenders will have said canon removed from their personal roster by <a href="http://thedasandbeyond.com/user/1">Administration</a> so that it can be re-listed for adoption.
<br />
<b>2.</b> Solo threads do not count toward the monthly minimum requirements for posting, the required 4 posts must to be in threads with other players.
<br />
<b>3.</b> Players with canon characters cannot turn down thread requests from other players without justifiable cause or explanation such as:
<br />
◦ The canon character is in a different kingdom, city, etc. thus making it somehow implausible because… oceans, etc.
<br />
◦ The canon character is already in 10 separate threads (we don’t want to overload players).
<br />
◦ The canon character is unavailable on a  specific in-game date (via the <a href="http://thedasandbeyond.com/board/35/calendar-system" target="_blank">Chantry Calendar</a> because they’re already in a thread at that time).
<br />
<b>4.</b> Players with canons must lead by example in threading with other players. Canon-holding players solo threading a canon with one of their own original characters, without other players involved, is not allowed—remember this is a roleplaying <i>community</i>, not a fanfic one. Collaboration is key. Major canons, or those with high social ranks (monarchs, military leaders, etc.), should be active on the boards, leading small plots, and encouraging fellow players to join threads.
<br />
<b>5.</b> Canon characters must make an effort to engage with non-canon characters. Do not ignore OCs in favour of other canons.
<br />
<b>6.</b> Exceptions will be made, concerning the above, on a case by case basis at <a href="http://thedasandbeyond.com/user/1">Administration's</a> discretion.</p></div>

<a name="Reserved"></a>
<div class="accordion">
   <label for="to" class="accordionitem"><h2>1.1.2. Reserved Canons <span class="arrow">&raquo;</span></h2></label>
   <input type="checkbox" id="to"/>
   <p class="hiddentext">If a canon is listed as reserved, it means they're either currently being applied for by another player and/or an administrator or moderator has requested they be set aside for a future plot. You cannot apply for reserved characters. Some canon characters are listed as “Mods Only”, that is because the canon in question is probably in-game leadership (which requires some OOC leadership in turn).
<br />
Spirit Warrior is a Warrior specialization exclusive to staff, and even then it will only be allowed in rare instances. We can’t have a dozen Kristoff/Justice’s running around all at once. That’s too much of a narrative free-for-all.
<br />
Blood Mages are similarly reserved albeit non-staff who've shown their abilitiy as fair and balanced players in-game will be allowed to apply for this specialization for their second, third, etc. once their probabtion period is over. Blood Mages are also restricted to Apostates, specifically—in our game, Circle Mages cannot be Blood Mages (the Templars would've found out and killed them). A former Circle Mage-turned-Apostate is allowed, however.</p></div>

<a name="Unplayable"></a>
<div class="accordion">
   <label for="to" class="accordionitem"><h2>1.1.3. Unplayable Canons <span class="arrow">&raquo;</span></h2></label>
   <input type="checkbox" id="to"/>
   <p class="hiddentext">Some canon characters are simply too powerful to allow for fair gameplay. Shapeshifters like Flemeth or Morrigan won’t be allowed, and God-like or Old God characters like Flemeth or Solas <i>definitely</i> won’t be allowed in our game. We may use Solas as an NPC in the distant future, following the release of the next Dragon Age installation. As of right now, we’re considering Solas MIA.
<br></br>
Non-Dragon Age characters from other video games, comics, books, or movies are not permitted. You can only play an entirely original character of your own crafting or a Dragon Age canon character. Moreover, the <a href="http://thedasandbeyond.com/board/357/codex-races-thedas" target="_blank">Races</a> in our game are canon to the Dragon Age universe as well—as such we will never allow other random or mythical creatures in our game (i.e. no anthropomorphic races, no vampires, no hobbits, etc.).
<br></br>
Darkspawn, Demons, and Spirits of the Fade are not allowed to be applied for, either, as they’re entirely NPCs in our game. Cole is somewhat of an exception because we’ve “made him more human” (plus, he’s an adorable cinnamon roll).</p>
 </div>

</div>
</div>
</div>

[Scott]

Aliana , the reason the last two don't work is that you are using the same

<label for="to"
and
<input type="checkbox" id="to"/>
for the last three accordions.



You'll need to make a unique "to" id for each of the last two and add the associated CSS.

I assume this is clear since you set this up?  If not let me know. 

(Sorry I didn't notice this earlier.)

[Aliana]

Feb 8, 2019 11:17:15 GMT -8 Scott said:

Aliana , the reason the last two don't work is that you are using the same

<label for="to"
and
<input type="checkbox" id="to"/>
for the last three accordions.



You'll need to make a unique "to" id for each of the last two and add the associated CSS.

I assume this is clear since you set this up?  If not let me know. 

(Sorry I didn't notice this earlier.)

Oh I'm a dope. Yup, that was it. Thank you.