Remove self closing tag of images and hr.

[Raza403]

This should be configured in Jekyll. Here is the build example https://github.com/fulldecent/github-pages-template/actions/runs/7207725670/job/19635154887#step:8:31

[Raza403]

Jekyll is using Karamdown for converting. In karamdown self closing tag is hardcoded. This error is for not having self closing tag for void elements. If we really want to fix this, we can use a custom plugin here.

[fulldecent]

Please link to issue on kramdown or create one

[Raza403]

Issue created on karamdown, and here is the reply we got.

[fulldecent]

Okay, it is out of scope for Kramdown. New plan. Please turn off the rule https://html-validate.org/rules/no-self-closing.html

Then raise an issue to for that rule to support only allowing self-closing for HTML5 elements that are usually self-closing:

Complete list (source: ask GPT what html5 elements are usually self closing):

<img>: Used for embedding images.
<br>: Line break, used to break the line of text.
<hr>: Horizontal rule, used to create a thematic break in an HTML page.
<meta>: Provides metadata about the HTML document, such as character set, page description, keywords, author of the document, and viewport settings.
<link>: Used to link external resources like CSS files.
<input>: Used to create interactive controls for web-based forms.
<area>: Defines a hot-spot region on an image, and optionally associates it with a hypertext link.
<base>: Specifies the base URL/target for all relative URLs in a document.
<col>: Specifies column properties for each column within a <colgroup> element.
<command>: A deprecated element that was used to define a command button, like a dropdown menu, a radio button, or a checkbox.
<embed>: Allows you to embed external content at the specified point in the document. This could be a multimedia player, a plugin, or an interactive application (like a Flash application).
<keygen>: A legacy feature that was used to facilitate generation of a key pair (a public and a private key).
<param>: Used to define parameters for an <object> element.
<source>: Used with media elements like <audio> and <video> to specify multiple media resources.
<track>: Used as a child of the media elements <audio> and <video>. It lets you specify timed text tracks (like subtitles).

and note this is a workaround for Kramdown and link to the Kramdown issue.

Then disable the rule in our settings. And add a reference there to this issue. (So later we can narrow our rule if they add a setting to that rule.)

[Raza403]

@fulldecent our problem is not no-self-closing our problem is void-style which is enforcing no self-closing on void elements. I have implemented the following code according to the documentation but it is not working, I have tried different variations too but none is working.

"rules": {
        "void-style": [ 0, { "style": "selfclosing" }]
      }

and

"rules": {
        "void-style": [ "off", { "style": "selfclosing" }]
      }

[Raza403]

Issue created in the main html-validate repository.