My markup is
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>klaymen - About</title>
</head>
<body>
<h1>Klaymen</h1>
<img src="resources/klaymen-about.jpg" width="200" alt="Klaymen's about picture">
</body>
When I test the document with this validator https://validator.w3.org/#validate_by_input I get the following error:
document type does not allow element "IMG" here; missing one of "P", "H1", "H2", "H3", "H4", "H5", "H6", "DIV", "ADDRESS" start-tag
Clearly I have an H1
, and img
is a flow content element which supposed to be allowed in this location, so what is the problem?
You can use a div
container.
<div>
<img src=""/>
<span display: block>Text below the image</span>
</div>
This happens because the body
of a document in this spec cannot contain an inline element like <img>
, thus, by putting it inside a block element like <div>
, all's fixed.