for属性とid属性を関連付ける

Question

前提・実現したいこと

<label>タグを使用し、フォームのパーツとラベルが関連付けされ、そのテキストも含んだ選択項目全体がクリックできるようにしたい

発生している問題・エラーメッセージ

チェックボックスでしかチェックできず、テキストをクリックしてもチェックできません。

該当のソースコード

<p>
      希望旅行先：
        <input type="checkbox" name="travel" value="日本国内"　id="japan">
        <label for="japan">日本国内</label>

        <input type="checkbox" name="travel" value="ヨーロッパ"　id="europe">
        <label for="europe">ヨーロッパ</label>

        <input type="checkbox" name="travel" value="東南アジア"　id="asia">
        <label for="asia">東南アジア</label>
    </p>

補足情報（FW/ツールのバージョンなど）

WEBデザインに興味を持ち、HTMLを勉強し始めたものです。

Comments

[m.ts10806]

>WEBデザインに興味を持ち、HTMLを勉強し始めたものです。
あの、「補足情報」というのは個人の事情ではなくカッコ内にあるように
どんなフレームワーク使っているとかバージョンとか、環境情報を書くものです。
試したこと調べたことを記載するとかそういうのがあったほうが
アドバイスする側としてはありがたいです。

Answer 1

すべてのid属性値の前の空白が全角になってしまっています。

<!--                                                ↓全角空白なので半角に。 -->
<input type="checkbox" name="travel" value="日本国内"　id="japan">

Comments

[deruta0104]

ありがとうございます！！解決しました！！