<hr>: The Thematic Break Element Bookmark

Did you know that the good old <hr> element has changed to a semantic meaning? What we used to know as the “Horizontal Rule” element which was just a line, now is called the “The Thematic Break” element. So instead of a presentational element, <hr> is now a rather semantic element.

Well, I came across it more or less by accident and didn’t know. It must have changed some time ago already, I’m not sure when. It’s also not one of those that you would need or use a lot or look up in the spec…

The HTML <hr> element represents a thematic break between paragraph-level elements: for example, a change of scene in a story, or a shift of topic within a section.


Historically, this has been presented as a horizontal rule or line. While it may still be displayed as a horizontal rule in visual browsers, this element is now defined in semantic terms, rather than presentational terms, so if you wish to draw a horizontal line, you should do so using appropriate CSS.

Find more details in <hr>: The Thematic Break (Horizontal Rule) element on MDN.

Leave a comment

Available formatting commands

Use Markdown commands or their HTML equivalents to add simple formatting to your comment:

Text markup
*italic*, **bold**, ~~strikethrough~~, `code` and <mark>marked text</mark>.
- Unordered item 1
- Unordered list item 2
1. Ordered list item 1
2. Ordered list item 2
> Quoted text
Code blocks
// A simple code block
// Some PHP code
[Link text](https://example.com)
Full URLs are automatically converted into links.

Replied on your own website? Send a Webmention!