htmlw3c-validationhtml4

<img> after <h1> does not validate as HTML 4.01 Strict


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?


Solution

  • 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.