atomでlabel要素を使うと赤線が表示される

Question

前提・実現したいこと

teratailで質問するのは今回が初めてです。
HTML初心者です。

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

atomでlabel要素を使うと赤線が表示されます
どうすればいいのでしょうか?

該当のソースコード

HTML

<form action="" method="post"> <p> <label for="your_name">お名前:</label> <input type="text" id="your_name" name="your_name"> </p>

試したこと

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

Answer 1

p要素の中にlabel要素もinput要素も置けないからです。
どうしても何かで囲う必要があるならdiv要素でも使いましょう。

【<p>: 段落要素 - HTML: HyperText Markup Language | MDN】
https://developer.mozilla.org/ja/docs/Web/HTML/Element/p

許可されている内容 記述コンテンツ

【#記述コンテンツ コンテンツカテゴリー - 開発者ガイド | MDN】
https://developer.mozilla.org/ja/docs/Web/Guide/HTML/Content_categories#phrasing_content

Comments

[Shunya0615]

ありがとうございます!