質問: ![![イメージ説明](https://teratail-v2.storage.googleapis.com/uploads/contributed_images/edc46d3842e0065dd1c1eccc965e7790.png)](6e66d5b6634bc83913ad448bb8c1adf5.png)### 前提・実現したいこと ここに質問の内容を詳しく書いてください。 (例)PHP(CakePHP)で●●なシステムを作っています。 ■■な機能を実装中に以下のエラーメッセージが発生しました。 ### 発生している問題・エラーメッセージ div要素で囲う意味を教えてほしいです。 div要素で囲まなくてもできるという考えでした。調べてもよくわからなかったので、どうかお願いいたします。 やはり、要所要所で変わってくるのですかね。。。 どのような場合に、div要素で囲んだほうがいいかも教えてほしいです。 ``` エラーメッセージ ``` ### 該当のソースコード ``` /*誤ったコード*/ ログイン /*Progateでの答え*/ ログイン ``` ここに言語名を入力 HTML ``` ### 試したこと Webサイトにて、div要素の意味を改めて調べてみましたがどうもしっくりくるものがなかったです。 インライン要素を囲まなくてもできるのでは?と思ってしまいます。 ### 補足情報(FW/ツールのバージョンなど) ここにより詳細な情報を記載してください。 Progateの道場中級編の2でつまずいています。 boxとcontainerは一緒のものです。 ...には、urlが入ります。
回答: Progateってここで時々見ますが私はよくしらないし思想とかもさっぱりわからないのですが私は「マークアップに正解はない」と思っているので ぶっちゃけ期待した結果ができればいいと思っています。 そこをdivで囲う意味は、Progateの正解とやらのコードを書いた人しか わからないかなと。タグの使用意図をすべて書いてあるなら...と思ったのですが 質問者がここに来て質問しに来るということは、ないということでしょうし ない以上は想像することしかできません。 /*誤ったコード*/となっていますが私はそうは思いません。 Progateと違うだけでやれることやれてれば正解だと思います。 特にdivの意味付けなんて個人の裁量によるものがほとんどかなと。 横並びだけでもtableがfloatになったりinline-blockになったりflexになったり gridになったりする以上マークアップの形もある程度ころころ変わる もんだと思います。「Progateがそうしていたから」っていう感じで divを増やすのではなく自分でしっかり意味付けしたタグであれば それはそれで正解かなと思いますね。 質問とはかけ離れた話になってしまいました笑