Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Closing tag with ID property

Question: If I close any html tag in this fashion (Including the id property):

<div id="tagid" >...more html
...
</div id="tagid" >

Will it affect the page, or won't like it, or disrupt any W3C rules...how can I put it...will it affect in any way?

Why?: Simply personal preference.
Instead of writing additional comments next to the tag, I simply add the id to help me know WHAT tag is closed -The tag is closed any way, so I guess it won't do anything (or so I think)

PS. FYI, I am a beginner

like image 726
Omar Avatar asked Jan 16 '12 22:01

Omar


People also ask

Does a div id need a closing tag?

Div tag has both open(<div>) and closing (</div>) tag and it is mandatory to close the tag. The Div is the most usable tag in web development because it helps us to separate out data in the web page and we can create a particular section for particular data or function in the web pages.

Which tag requires a closing tag?

An opening tag begins a section of page content, and a closing tag ends it. For example, to markup a section of text as a paragraph, you would open the paragraph with an opening paragraph tag <p> and close it with a closing paragraph tag </p> (closing tags always proceed the element with a /).

Does a tag needs to be closed?

A tag must always be closed by the tag close symbol > (if we ignore certain SGML rules that nominally apply in non-XHTML HTML but were never implemented in browsers). What you mean to ask is whether the elements need to be closed by end tags.

Which tags do not required closing tags?

The void elements or singleton tags in HTML don't require a closing tag to be valid. These elements are usually ones that either stand alone on the page ​or where the end of their contents is obvious from the context of the page itself.


1 Answers

Quoting my other answer in stackoverflow:

Recently having to perform maintenance on older code, I found that using comments at the end of a div tag really made it difficult to comment out large sections of code thanks to HTML not having nestable comment tags. So, I got into the habit of modifying the comments into hidden spans at the end of large block divs.

<div class="modal fade" id="dialog_edit_group">
    <div class="modal-dialog">
        <div class="modal-content">
            ...HTML content here...
        </div><span title=".modal-content" HIDDEN></span>
    </div><span title=".modal-dialog" HIDDEN></span>
</div><span title=".modal #dialog_edit_group" HIDDEN></span>
<!--
<div class="modal fade" id="dialog_edit_group_OLD">
    <div class="modal-dialog">
        <div class="modal-content">
            ...HTML content here...
        </div><span title=".modal-content" HIDDEN></span>
    </div><span title=".modal-dialog" HIDDEN></span>
</div><span title=".modal #dialog_edit_group_OLD" HIDDEN></span>
-->

I put the "HIDDEN" HTML5 attribute in there so if others modify it and add text for some reason, the contents will usually stay hidden. I made it ALL CAPS so that it would stand out a bit more as if to shout "COMMENT HERE!". Yes, it does create a DOM element that now has to be maintained by the browser, but its a small price to pay during heavy active website development.

Using "end div comments" as such conforms to the HTML standard, gives me greater readability and allows me to use the HTML comment tag to disable large blocks of the page to aid in development. Maybe it will be useful for others as well.

like image 50
Uncle Code Monkey Avatar answered Sep 19 '22 12:09

Uncle Code Monkey