HTML validation error document type does not allow element "hr"

StackOverflow https://stackoverflow.com/questions/21453444

  •  04-10-2022
  •  | 
  •  

Question

I want to show list of article as image, title, hr and date using UL. But i am getting validation error when i test them on http://validator.w3.org/ when testing actual website

Below is the dummy schema & is almost copy of the actual HTML this when i test below HTML as code it doesnt generate errors but when i test url it generates error as show below

document type does not allow element "hr" here; missing one of "object", "applet", "map", "iframe", "button", "ins", "del" start-tag

                                    <hr />

The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element.

One possible cause for this message is that you have attempted to put a block-level element (such as "

" or "") inside an inline element (such as "", "", or "").

HTML CODE

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title></title>
</head>
<body>
<div class="listwrapper">
  <ul>
    <li>
      <img src="http://lorempixum.com/100/100/nature/1" alt="image" />
      <span>Headline</span>
      <p>Lorem ipsum dolor sit amet...</p>
          <hr/>
    </li>

    <li>
      <img src="http://lorempixum.com/100/100/nature/2" alt="image"/>
      <span>Headline</span>
      <p>Lorem ipsum dolor sit amet...</p>
          <hr/>
    </li>

    <li>
      <img src="http://lorempixum.com/100/100/nature/3" alt="image"/>
      <span>Headline</span>
      <p>Lorem ipsum dolor sit amet...</p>
          <hr/>
    </li>

    <li>
      <img src="http://lorempixum.com/100/100/nature/4" alt="image"/>
      <span>Headline</span>
      <p>Lorem ipsum dolor sit amet...</p>
          <hr/>
    </li>
  </ul>
</div>
</body>
</html>

UPdate: I tried replacing html with div, span but i kept generating same error

No correct solution

OTHER TIPS

The w3schools page about HR says it's used for creating a break in the content for switching topic or such. So i guess you "can't" use it in inline elements. I would do like @stckrboy suggested in the comments, and create the line with CSS instead.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top