Search code examples
htmlvalidation

How to find the unclosed div tag


A unclosed div problem almost make me crazy. It is very difficult to track especially when the page is long and complex.

<div>
   <span>
       <b>Text</b>
       <a href="/">Title <span>another test</span>
   </span>
</div>

How can I find unclosed HTML-tags on a website?

Any suggestions?


Solution

  • As stated already, running your code through the W3C Validator is great but if your page is complex, you still may not know exactly where to find the open div.

    I like using tabs to indent my code. It keeps it visually organized so that these issues are easier to find, children, siblings, parents, etc... they'll appear more obvious.

    EDIT: Also, I'll use a few HTML comments to mark closing tags in the complex areas. I keep these to a minimum for neatness.

    <body>
    
        <div>
            Main Content
    
            <div>
                Div #1 content
    
                <div>
                   Child of div #1
    
                   <div>
                       Child of child of div #1
                   </div><!--// close of child of child of div #1 //-->
                </div><!--// close of child of div #1 //-->
            </div><!--// close of div #1 //-->
    
            <div>
                Div #2 content
            </div>
    
            <div>
                Div #3 content
            </div>
    
        </div><!--// close of Main Content div //-->
    
    </body>