End tag(div) seen too early. のエラーが出る【progate html道場中級編】

progateにて、学習をはじめた者です。

html&css 道場コース中級編にて、閉じタグ（８０行目）が間違っているとのことで、このコースのクリアができません。
End tag seen too early.
閉じタグが早すぎる？とのことで、色々確認し、答えとも比べてみたのですが、どう早すぎるのかがわかりませんでした。
（visual studio codeにコピペしたところ、エラーの表示は出ませんでした）

解決方法、原因がわかる方、ご教授お願いいたします。

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

End tag (div) seen too early.

該当のソースコード

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Progate</title>
  <link rel="stylesheet" href="stylesheet.css">
  <!-- ここでFont Awesomeを読み込んでください -->
  <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
</head>
<body>
  <!-- ここにコードを書いていきましょう -->
 <header>
   <div class=header-item>
   <img class="header-logo" src="https://prog-8.com/images/html/advanced/main_logo.png">
   </div>
 
   <a class="login" href="#">ログイン</a>
 </header>

  <div class="top">
    <div class="top-logo">
      <h1>LARN TO CODE.</h1>
      <h1>LEARN TO BE CREATIVE.</h1>
      <p>Progateはオンラインプログラミング学習サービスです。</p>
      <p>初心者にもやさしいスライドとレッスンで、ウェブサービスを作りながらプログラミングを学んでいきましょう。</p>
    </div>
  
    <div class="btn3">
      <a href="#" class="btn new"> 新規登録はこちら</a>
      <p>or</p>
      <a href="#" class="btn fb"><span class="fa fa-facebook"></span> Facebookで登録</a>
      <a href="#" class="btn tw"><span class="fa fa-twitter"></span> Twitterで登録</a>
    </div>
  </div>  
     <div class="menu">
     <div class="container">
       <div class="hedding">
         <h2>Learn Where to Get Started!</h2>
       </div>
       
       <div="lessons">
         
         <div class="lesson">
           <div class="lesson-icon">
             <p>HTML & CSS</p>
             <img src="https://prog-8.com/images/html/advanced/html.png">
            </div>
            <div class="lesson-text">
             <p>ウェブページの作成に使用される言語です。HTMLとCSSを組み合わせることで、静的なページを作り上げることができます。</p>
           </div>
         </div>
        
         <div class="lesson">
           <div class="lesson-icon">
             <p>jQuary</p>
             <img src="https://prog-8.com/images/html/advanced/jQuery.png">
            </div>
            <div class="lesson-text">
             <p>素敵な動きを手軽に実装できるJavaScriptライブラリです。 アニメーション効果をつけたり、Ajax（エイジャックス）を使って外部ファイルを読み込んだりと色々なことができます。</p>
           </div>
         </div>
        
         <div class="lesson">
           <div class="lesson-icon">
             <p>Ruby</p>
             <img src="https://prog-8.com/images/html/advanced/ruby.png">
            </div>
            <div class="lesson-text">
             <p>オープンソースの動的なプログラミング言語で、 
             シンプルさと高い生産性を備えています。大きなWebアプリケーションから小さな日用ツールまで、
             さまざまなソフトウェアを作ることができます。</p>
         </div>
         </div>
       
         <div class="lesson">
             <div class="lesson-icon">
               <p>PHP</p>
               <img src="https://prog-8.com/images/html/advanced/php.png">
             </div>
              <div class="lesson-text">
               <p>HTMLだけではページの内容を変えることはできません。PHPはHTMLにプログラムを埋め込み、それを可能にします。</p>
             </div>
         </div>
      
       </div> 
    </div>
</body>
</html>

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

ここにより詳細な情報を記載してください。

行動規範の内容に同意します

回答2件

ベストアンサー

HTML の lint ツールを利用されると良いと思います。VSCode であれば、HTMLHintとかでしょうか。
とりあえず、Web版であれば、
http://www.htmllint.net/html-lint/htmllint.html#
とか
http://openlab.ring.gr.jp/k16/htmllint/htmllint.html
でしょうか。

それで、貼っていただいたものを解析してみると、
41行目の div の属性指定がおかしい（おそらく class= だと思われる）
のと、</div>がたりないことがわかります。

投稿2020/07/11 06:56

mit0223

総合スコア3401

退会済みユーザー

2020/07/11 11:33

ありがとうございます！ツールもしようしてみます。

行動規範の内容に同意します

classくくってない

html
1 <header>
2   <div class=header-item>

要素の指定がおかしい

html
1       <div class="hedding">
2         <h2>Learn Where to Get Started!</h2>
3       </div>
4
5       <div="lessons">
6
7         <div class="lesson">