HTML Guides for non-space characters
Learn how to identify and fix common HTML validation errors flagged by the W3C Validator — so your pages are standards-compliant and render correctly across every browser. Also check our Accessibility Guides.
The HTML specification defines a strict content model for tables. A <table> element can only contain <caption>, <colgroup>, <thead>, <tbody>, <tfoot>, and <tr> as direct children. A <tr> element can only contain <td> and <th> elements. When text or inline elements like <span>, <a>, or <strong> appear directly inside any of these table-structural elements, they violate the content model and trigger this validation error.
This matters for several reasons. Browsers handle misplaced table content inconsistently — some will silently move the text before the table, others may discard it, and some may attempt to create anonymous table cells. This leads to unpredictable layouts across browsers and devices. Screen readers rely on correct table structure to navigate cells and announce row/column relationships, so misplaced content can confuse assistive technology users. Additionally, any text placed directly inside a <tr> but outside a cell is technically not part of any row/column structure, making it semantically meaningless in the table context.
Common causes of this error include:
- Accidentally placing text between <tr> and <td> tags
- Placing a heading or paragraph directly inside a <table> (use <caption> instead for table titles)
- Using non-breaking spaces ( ) or other characters directly inside <table> or <tr> for spacing
- Incorrectly nesting non-table elements like <div>, <p>, or <form> as direct children of <table> or <tr>
Examples
Text directly inside a table row
<!-- ❌ Wrong: text is a direct child of <tr> -->
<table>
<tr>
Hello World
<td>First Cell</td>
<td>Second Cell</td>
</tr>
</table>
<!-- ✅ Fixed: text is wrapped in a <td> -->
<table>
<tr>
<td>Hello World</td>
<td>First Cell</td>
<td>Second Cell</td>
</tr>
</table>
Text directly inside a table element
<!-- ❌ Wrong: heading and spacing text placed directly in <table> -->
<table>
Monthly Sales Report
<tr>
<th>Month</th>
<th>Revenue</th>
</tr>
</table>
<!-- ✅ Fixed: use <caption> for table titles -->
<table>
<caption>Monthly Sales Report</caption>
<tr>
<th>Month</th>
<th>Revenue</th>
</tr>
</table>
Non-breaking spaces used for spacing
<!-- ❌ Wrong: directly inside <tr> -->
<table>
<tr>
<td>Data</td>
</tr>
</table>
<!-- ✅ Fixed: use CSS for spacing, or place content in a cell -->
<table>
<tr>
<td>Data</td>
</tr>
</table>
Inline elements directly inside a table
<!-- ❌ Wrong: <a> tag directly inside <table> -->
<table>
<a href="/details">View details</a>
<tr>
<td>Item 1</td>
<td>$10.00</td>
</tr>
</table>
<!-- ✅ Fixed: move the link into a cell or outside the table -->
<table>
<tr>
<td>Item 1</td>
<td>$10.00</td>
<td><a href="/details">View details</a></td>
</tr>
</table>
Content between table sections
<!-- ❌ Wrong: text between <thead> and <tbody> -->
<table>
<thead>
<tr>
<th>Name</th>
</tr>
</thead>
No results found
<tbody>
<tr>
<td>—</td>
</tr>
</tbody>
</table>
<!-- ✅ Fixed: place the message inside a cell -->
<table>
<thead>
<tr>
<th>Name</th>
</tr>
</thead>
<tbody>
<tr>
<td>No results found</td>
</tr>
</tbody>
</table>
A missing or incorrectly placed <!DOCTYPE html> declaration at the very start of your HTML document causes this error.
The <!DOCTYPE html> declaration must be the very first thing in your HTML file, before any HTML code. This declaration tells the browser to use standards mode, ensuring reliable rendering. Without it, browsers may behave unpredictably or trigger quirks mode, and validators will issue an error.
Correct Example:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Valid HTML Document</title>
</head>
<body>
<p>Hello, world!</p>
</body>
</html>
Incorrect Example (doctype missing):
<html lang="en">
<head>
<title>Invalid HTML Document</title>
</head>
<body>
<p>Hello, world!</p>
</body>
</html>
Incorrect Example (doctype not at the very start):
Some misplaced text.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Invalid Placement</title>
</head>
<body>
<p>Hello, world!</p>
</body>
</html>
Always ensure <!DOCTYPE html> is the first line.
Ready to validate your sites?
Start your free trial today.