Frage HTML, CSS Häckenkästchen

[Gunnar Bittersmann]

@@Scorpion

Wenn du auf mein Posting antwortest, dann antworte bitte auf mein Posting, nicht auf deins.

Meinst Du so:

                    <input id="confirm1.1" type="checkbox" class="box"/><label for="confirm">1</label>

Nein. Ich sagte doch: Die for-Attribute sind auch mit umzubenennen. Der Wert des for-Attributs des Labels muss mit der id des Eingabefelds übereinstimmen, damit die Zuordnung hergstellt ist. Also

                    <input id="confirm1.1" type="checkbox" class="box"/><label for="confirm1.1">1</label>

usw.

---

        <div class="kapitel1"> <h2>Kapitel 1</h2>
            <h3> 7 Verse</h3>

Hier steckt auch ein Fehler: „7 Verse“ ist keine Unterüberschrift zu „Kapitel 1“, also keine h3.

Enweder das gehört mit zur h2: „Kapitel 1 – 7 Verse“, dann solle das so aussehen:

        <div class="kapitel1">
            <h2>Kapitel 1
                <span class="visually-hidden">–</span>
                <span class="verses">7 Verse</span>
            </h2>

mit den Styles für .visually-hidden aus How-to Hide content. Für .verses setzt du display: block und die Schriftgröße runter. (Oder du packst „Kapitel 1“ in ein span und setzt dafür die Schriftgröße rauf.)

Oder „7 Verse“ gehört nicht mit in die h2 „Kapitel 1“, sondern ist ein Zusatz:

        <div class="kapitel1">
            <hgroup>
                <h2>Kapitel 1</h2>
                <span class="verses">7 Verse</span>
            </hgroup>

Für die anderen Kapitel entsprechend.

---

Bei JavaScript kenn ich mich leider auch noch nicht so gut aus. Könntest Du mir da auch helfen?

Gerne. Hier ist aber SELFHTML, nicht Wie-ist-der-fertige-Code-HTML.

Die Zutaten sind: Das Speichern muss irgendwie ausgelöst werden (ein button?), also brauchst du einen EventListener. Die Zustände der Checkboxen fragst du mit checked ab und speicherst sie im local storage.

Für das Setzen beim Seitenauruf brauchst du keinen EventListener, wenn das script am Ende des body steht (oder anders sichergestellt ist, das es erst läuft, wenn alle Elemente schon im DOM sind).

Wenn du konkrete Fragen dazu hast, kannst du sie hier gern stellen.

Kwakoni Yiquan