P-End-Tag (</P>) Is Not Needed in HTML

P-end-tag ( /p ) is not needed in HTML

P-end-tag is only required in XHTML, not in HTML.

Correct

But some times you have to close it any way eg. when you align the paragraph left/right/center.

Incorrect. The only time you need an explicit end tag is when you want to end the paragraph and immediately follow it by something that is allowed inside a paragraph (such as text or an inline element). This is usually a bad idea.

Would it for any reason be a bad idea to mix the usage of P-end-tag

Only that consistency is a virtue which aids in code maintenance.

Does p tag need a closing /p tag? My friend said p doesn't need to be necessarily closed

In my experience its best to always include a closing tag. This is good for a few reasons:

If you are including your code into third party systems there is no telling what they are going to do to your code to make it valid.

E.G. in gmail you may find the second P tag to be completely removed whereas Outlook may close the first before the second P tag starts. Its best to keep things consistent.

Another example would be where Scrapers are generally going to need the HTML on the page to be as close to valid XML as possible in order to get the data they need.

It really depends on how you are using the code. My suggestion is to always close the tag but if for some weird reason you need to do it like that above just make sure to test test test... and test some more.

What do you call tags that need no ending tag?

This syntax has a variety of names depending on what language you are using. The best way to find out what it is called is to look at the specification for the specific language.

HTML 4.x

I can't find any mention of this syntax in the HTML 4.x specification. It is not valid syntax.

HTML 5

In the HTML 5 specification the / character (called a SOLIDUS) is valid but has no effect for void elements such as <br />, <hr />, <img />, <input />, etc. and for foreign elements (such as SVG tags) it designates a start tag that is marked as self-closing. It is not a valid syntax for all other tags (such as <button /> mentioned in your question).

Then, if the element is one of the void elements, or if the element is a foreign element, then there may be a single U+002F SOLIDUS character (/). This character has no effect on void elements, but on foreign elements it marks the start tag as self-closing.

XML

According to the XML specification it is called an empty-element tag:

The representation of an empty element is either a start-tag immediately followed by an end-tag, or an empty-element tag.

XHTML

According to the XHTML specification it is called the minimized tag syntax for empty elements:

C.2. Empty Elements

Include a space before the trailing / and > of empty elements, e.g. <br />, <hr /> and <img src="karen.jpg" alt="Karen" />. Also, use the minimized tag syntax for empty elements, e.g. <br />, as the alternative syntax <br></br> allowed by XML gives uncertain results in many existing user agents.

C.3. Element Minimization and Empty Element Content

Given an empty instance of an element whose content model is not EMPTY (for example, an empty title or paragraph) do not use the minimized form (e.g. use <p> </p> and not <p />).

In general if you want to be precise I would recommend using the names as defined in the appropriate standard. Then if people aren't exactly sure what you mean they can look it up in the standard to find out. However if you don't want to use the name in the standard you are free to call it something else if you want. The important thing is that the people who communicate with you can understand you. I don't think anyone would misunderstand you if you used the term 'self-closing tag' for a tag in an XML document even if the standard officially calls it something else.

Thanks to Alohci for the HTML 5 reference.

pre tag making browsers close paragraphs

Get rid of the pre tag altogether, and just give your span style="white-space:pre". See this page for a description of other white-space options.

<pre> is basically saying <div style="white-space:pre">; what you want is <span style="white-space:pre">.

HTML 5: Is it br , br/ , or br / ?

Simply <br> is sufficient.

The other forms are there for compatibility with XHTML; to make it possible to write the same code as XHTML, and have it also work as HTML. Some systems that generate HTML may be based on XML generators, and thus do not have the ability to output just a bare <br> tag; if you're using such a system, it's fine to use <br/>, it's just not necessary if you don't need to do it.

Very few people actually use XHTML, however. You need to serve your content as application/xhtml+xml for it to be interpreted as XHTML, and that will not work in old versions of IE - it will also mean that any small error you make will prevent your page from being displayed in browsers that do support XHTML. So, most of what looks like XHTML on the web is actually being served, and interpreted, as HTML. See Serving XHTML as text/html Considered Harmful for some more information.

Why does a stray /p end tag generate an empty paragraph?

That it is required is documented in HTML5. See http://w3c.github.io/html/syntax.html#the-in-body-insertion-mode and search down for An end tag whose tag name is "p" and it says:

If the stack of open elements does not have an element in button scope
with the same tag name as that of the token, then this is a parse
error; act as if a start tag with the tag name "p" had been seen, then
reprocess the current token.

Which translated into English means create a p element if the </p> tag can't be matched with an existing <p> tag.

Why it is so, is harder to ascertain. Usually, this is because some browser in the past caused this to happen as a bug, and web pages came to rely on the behaviour, so other browsers had to implement it too.

Why don't self-closing script elements work?

The non-normative appendix ‘HTML Compatibility Guidelines’ of the XHTML 1 specification says:

С.3. Element Minimization and Empty Element Content

Given an empty instance of an element whose content model is not EMPTY (for example, an empty title or paragraph) do not use the minimized form (e.g. use <p> </p> and not <p />).

XHTML DTD specifies script elements as:

<!-- script statements, which may include CDATA sections -->
<!ELEMENT script (#PCDATA)>

Closing HTML input tag issue

These are void elements. This means they aren't designed to contain text or other elements, and as such do not need — and in fact, cannot have — a closing tag in HTML.¹

However, they should have a <label> associated with them:

<input id="my_id" type="radio" name="radio_name">
<label for="my_id">Radio Label</label>

Radio buttons by nature can't contain text anyway, so it wouldn't make sense for them to accept text or other elements as content. Another issue with a control that does accept text as input: should its textual content then be its value, or its label? To avoid ambiguity we have a <label> element that does exactly what it says on the tin, and we have a value attribute for denoting an input control's value.

---

¹ _{XHTML is different; by XML rules, every tag must be opened and closed; this is done with the shortcut syntax instead of a </input> tag, although the latter is equally acceptable:}

<input id="my_id" type="radio" name="radio_name" />
<label for="my_id">Radio Label</label>

---

Related Topics