Checkbox-ul nu se bifează când se dă click pe etichetă

Nu sunt sigur dacă aceasta este o problemă specifică WordPress, dar când creez un formular simplu ca widget în sidebar, checkbox-ul nu se bifează când dau click pe etichetă. În mod ciudat, funcționează când am extras același formular prin get_template_part în navigație. Vreau să folosesc 'checkbox hack' care se bazează pe eticheta care trebuie să fie clicabilă. Formularul meu arată astfel:

<form action="http://email.littlefishfx.com/t/r/s/jijiat/" method="post">
    <p class="checks">
        <input id="fieldjtdktry-0" name="cm-fo-jtdktry" value="4469820" type="checkbox" /> <label for="fieldjtdktry-0"><span></span>Învață</label>
        <input id="fieldjtdktry-1" name="cm-fo-jtdktry" value="4469821" type="checkbox" /> <label for="fieldjtdktry-1"><span></span>Tranzacționează</label>
        <input id="fieldjtdktry-2" name="cm-fo-jtdktry" value="4469822" type="checkbox" /> <label for="fieldjtdktry-2"><span></span>Investește</label>
        <input id="fieldjtdktry-3" name="cm-fo-jtdktry" value="4469823" type="checkbox" /> <label for="fieldjtdktry-3"><span></span>Cheltuiește</label>
    </p>
    <p>
        <input id="fieldEmail" name="cm-jijiat-jijiat" type="email" required placeholder="Adresa ta de email" />
        <br />
        <button type="submit"><span>Abonează-te</span></button>
    </p>
</form>

Ambele formulare pot fi găsite la littlefishfx.com/contact, unul derulându-se în jos din butonul 'subscribe' din meniul principal și celălalt (același formular) în partea de jos a sidebar-ului.

Aveți vreun sfat despre de ce s-ar putea întâmpla asta? Aceleași rezultate în Chrome, Safari și Firefox (mac).

** EDITARE **

Dacă îmi împachetez checkbox-urile în etichetă astfel:

<label><input id="fieldjtdktry-0" name="cm-fo-jtdktry" value="4469820" type="checkbox" /><span></span>Învață</label>

Atunci click-ul pe etichetă funcționează peste tot. Aceasta pare o soluție de bună practică (?) dar mă lasă nedumerit în privința modului de utilizare a hack-ului checkbox pe care încercam inițial să-l implementez. Iată CSS-ul la care am lucrat:

input[type="checkbox"] {
    display:none;
}
input[type="checkbox"] + label span {
    display: inline-block;
    width: 20px;
    height: 20px;
    margin: -1px 6px 0 0;
    vertical-align: middle;
    background: url(images/checkbox-sprite.gif) left top no-repeat;
    cursor: pointer;
}
input[type="checkbox"]:checked + label span {
    background: url(images/checkbox-sprite.gif) right top no-repeat;
}