How to find the unclosed div tag

HtmlHtml Validation

Html Problem Overview

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?

Html Solutions

Solution 1 - Html

I made an online tool called Unclosed Tag Finder which will do what you need.

Paste in your HTML, and it will give you output like "Closing tag on line 188 does not match open tag on line 62."

Update: The new location of the Unclosed Tag Finder is https://jonaquino.blogspot.com/2013/05/unclosed-tag-finder.html

Solution 2 - Html

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>

Solution 3 - Html

the World Wide Web Consortium HTML Validator is great at catching HTML errors.

Solution 4 - Html

Use notepad ++ . you can find them easily

http://notepad-plus-plus.org/download/

Or you can View source from FIREfox - Unclosed divs will be shown in RED

Solution 5 - Html

I know that there have already been some good answers, but I came across this question with a Google Search and I wish someone would have pointed out this online

checking tool...

http://www.tormus.com/tools/div_checker

You just throw in a URL and it will show you the entire

map of the page. Very useful for a quick debug like I needed.

Solution 6 - Html

1- Count the number of <div in notepad++ (Ctrl + F)
2- Count the number of </div

Compare the two numbers!

Solution 7 - Html

If you use Dreamweaver you could easily note to unclosed div. In the left pane of the code view you can see there <> highlight invalid code button, click this button and you will notice the unclosed div highlighted and then close your unclosed div. Press F5 to refresh the page to see that any other unclosed div are there.

You can also validate your page in Dreamweaver too. File>Check Page>Browser Compatibility, then task-pane will appear Click on Validation, on the left side there you'll see ► button click this to validate.

Enjoy!

Solution 8 - Html

Taking Milad's suggestion a bit further, you can break your document source down and then do another find, continuing until you find the unmatched culprit.

When you are working with many modules (using a CMS), or don't have access to the W3C tool (because you are working locally), this approach is really helpful.

Solution 9 - Html

Div tags are easy to spot for me. Just download the file, scan it or so with netbeans, then continue debugging it. Or you can use the Google chrome developer kit, and view the page source. I'm a bit of a weird developer, I don't always use the "best" stuff. But it works for me.

I'll link you with some developer stuff I use

http://www.coffeecup.com/free-editor/

http://www.netbeans.org

Those are just a few of the good ones out there. I'm open to more suggestions to this list :D

Happy programming

-skycoder

Categories
Recommended Html Solutions
Recommended Html Validation Solutions

Previous Solution:

Very High Memory Usage in .NET 4.0

C#.Net.Net 4.0Garbage CollectionRdlc

Next Solution:

Validate presence of field only if another field is blank - Rails

Ruby on-RailsRuby on-Rails-3

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
Questionuser503853View Question on Stackoverflow
Solution 1 - HtmlJonathan AquinoView Answer on Stackoverflow
Solution 2 - HtmlSparkyView Answer on Stackoverflow
Solution 3 - HtmlrockerestView Answer on Stackoverflow
Solution 4 - HtmlThilanka De SilvaView Answer on Stackoverflow
Solution 5 - HtmlNoah WhitmoreView Answer on Stackoverflow
Solution 6 - HtmlMiladView Answer on Stackoverflow
Solution 7 - HtmlBhojendra RauniyarView Answer on Stackoverflow
Solution 8 - HtmlRogerRogerView Answer on Stackoverflow
Solution 9 - HtmlTheCodingKlamView Answer on Stackoverflow