When to use closing tag and when not to use?

Hi Renukumari,

As John said, you'll eventually start remembering which tags are self-closing and it'll become second nature.

But just to add on to this, a simple way of remembering the basic ones is to ask yourself whether the tag is used to surround actual text content or not.

For example, you will separate the text of your website with all kinds of elements: paragraphs, headlines, list items, labels, etc. The thing that all these types of elements have in common is that you will be using them to display (and organize) visible text on your site. So they will need to have opening and closing tags that surround each section of text that you want to display. You'll need to know when the headline ends so that the paragraph can begin.

You'll notice too, that a lot of these types of tags don't require any mandatory attributes to be set inside the opening tag. You will of course set up a lot of classes and id's and stuff like that, but you can still use a raw <p></p>.

But when it comes to self-closing tags, like <link>, <meta>, <img> or <input>, you aren't going to be using them to directly contain visible text. Sure, some of them like <img> will produce visible content on your site, but if you think about it, only the address of the image is required to display it, and the address itself won't be visible as content.

Lot's of these self-closing tags will require mandatory attributes to be set inside them because that is how they will serve their purpose, by either pulling in data from elsewhere to generate content, or by setting up content that isn't plain text.

There are exceptions of course, like <script> or <style> tags, but hopefully this serves as a general guide to help you remember some of them.

And just to address the example in the video. You don't actually need to surround text with tags. It can still be displayed as raw text on its own, but the disadvantage is that it won't be contained and it will be very difficult to style and move around.

In the video, it is a little confusing. The input tag is always self closing but the text that followed was actually just plain uncontained text. But by using the <br> tag right after to force a line break. it became contained.