What are void elements?
<br>, <img>, <input>.
Most HTML elements have a start tag, content, and a closing tag — <p>text</p>. A small set of elements can't contain content at all. They're called void elements, and they have no closing tag. Their content is described by their attributes, not their children. Knowing the list saves you from invalid markup and a validator full of errors.
Short answer: HTML5 has 14 void elements: area, base, br, col, embed, hr, img, input, link, meta, param, source, track, wbr. They have no closing tag. The trailing slash (<br />) is optional and ignored in HTML5 — it was required in XHTML. Pick one style and be consistent.
✅ The complete list
All 14 void elements and what each is for.
<area>
Clickable area in an image map. Defines a region of an <img> with usemap.
<base>
Base URL for relative links on the page. One per document. Rarely used.
<br>
Line break. Use sparingly — CSS for layout, not <br>. Only for poetry, addresses, or code.
<col>
Defines a column in a table. Used inside <colgroup> to style columns without targeting cells.
<embed>
Embeds external content — PDFs, media, plugins. Largely replaced by <iframe> for third-party content.
<hr>
Thematic break — a section divider. Not a "horizontal line" — that's a visual style. Use for content breaks.
<img>
Image. Content comes from src, not children. Always include alt.
<input>
Form control. The content is configured by attributes (type, value, placeholder).
<link>
External resource — stylesheet, favicon, preload. In <head>, not the body.
<meta>
Metadata — charset, viewport, description, OG tags. In <head>.
<param>
Parameter for <object>. Deprecated — replaced by attributes on the object itself.
<source>
Media source for <video>, <audio>, or <picture>. Multiple sources per element.
<track>
Text track for <video> — subtitles, captions, chapters. One per language or purpose.
<wbr>
Word break opportunity. Hints where a long word can wrap if needed. No visual effect unless the line overflows.
✅ Before and after
Valid vs invalid markup for void elements.
<img src="photo.jpg" alt="Photo"></img> <br></br> <input type="text"></input> <hr></hr> <meta charset="UTF-8"></meta>
❌ Closing tags on void elements are invalid HTML5. ❌ The browser ignores them — but the validator errors. ❌ The markup is longer and confusing to read.
<img src="photo.jpg" alt="Photo"> <br> <input type="text"> <hr> <meta charset="UTF-8">
✅ No closing tags — HTML5 valid. ✅ Cleaner, shorter markup. ✅ The browser treats each as self-contained.
<img src="photo.jpg" alt="Photo" /> <br /> <input type="text" /> <hr /> <meta charset="UTF-8" />
✅ Also valid in HTML5 — the slash is optional and ignored. ✅ Required in XHTML — some formatters keep it for consistency. ✅ Pick one style across the project and stick with it.
Don't confuse void elements with empty elements. A void element cannot have content by definition — <img>, <br>, <input>. An empty element is just one that happens to have no children in your markup — <p></p> is empty but not void. The distinction matters because void elements don't accept a closing tag, while empty non-void elements do. If you're writing <img></img>, you're mixing the two.
⚠️ Common mistakes
The void-element mistakes that cost real time.
<img src=x></img> — invalid. Fix: no closing tag for void elements.
<input>text</input> — the text is not a child. Fix: use value attribute, or a proper form control.
<br> for layout spacing<br><br><br> for gaps. Fix: CSS margin or gap. Reserve <br> for actual line breaks.
alt on <img>Accessibility error. Fix: always alt, even empty alt="" for decorative images.
<meta> or <link> in <body>They're valid only in <head>. Fix: move them into <head>.
<div /> is invalid — the browser treats it as an unclosed div. Fix: only void elements are self-closing.
Some files use <br />, others <br>. Fix: pick one style, use a formatter (Prettier) to enforce it.
<div><img></div> when not needed. Fix: images are block-or-inline via CSS — no wrapper required.
❓ Frequently asked
What is a void element in HTML?
A void element is an HTML element that cannot have any content — no children, no text. Because it can't contain anything, it has no closing tag. Examples: br for line break, img for image, input for form input, hr for horizontal rule, meta for metadata, link for external resources. The HTML spec lists 14 void elements. They're also called empty elements. The browser parses them as self-contained — there's nothing to close.
Do I need to self-close void elements with a slash?
No. In HTML5, the trailing slash on a void element is optional and ignored. br and br/ are both valid. The slash was required in XHTML, and some developers still write it out of habit or because their formatter adds it. It does not affect rendering. Pick one style and be consistent. Most modern formatters default to no slash. The HTML spec explicitly permits both.
What is the complete list of void elements?
HTML5 has 14 void elements: area, base, br, col, embed, hr, img, input, link, meta, param, source, track, wbr. Each serves a specific purpose: area for image maps, base for URL base, br for line breaks, col for table columns, embed for embedded content, hr for thematic break, img for images, input for form controls, link for external resources, meta for metadata, param for plugin parameters, source for media sources, track for text tracks, wbr for word break opportunity. Anything not on this list has a closing tag.
What happens if I add a closing tag to a void element?
The browser ignores it. Writing img src=x /img is not what the browser sees — the parser treats img as self-closing and the /img is either discarded or becomes a literal text node. In HTML5, closing tags for void elements are not allowed. The validator flags them as errors. If your formatter or framework generates them, the page still renders, but the markup is invalid. Remove the closing tag for correctness.
Is img a void element?
Yes. img is a void element — its content comes from the src attribute, not from children. It has no closing tag. The common mistake is writing img /img or img with an empty child. Both are invalid in HTML5. The image's alt text, width, height, and srcset are all attributes on the img tag itself. There is no img content. The same applies to input, br, hr, meta, link, and the other 9 void elements.
Can I use <br> for spacing between paragraphs?
No. Multiple br tags are a layout hack that breaks screen reader flow and makes content harder to parse. Use CSS margin or padding on the paragraph element instead. br is for line breaks within a single block of text — a poem, an address, or a code snippet where the line break is part of the content. For vertical space between blocks, use CSS. This is one of the most common misuse patterns in beginner HTML, and it's worth fixing early.