Broken Vertical Spacing When Printing To HTML

[cvogt729]

I use the following Markdown extensions in vscode:

• Markdown Preview Github Styling
• Markdown All in One
• Markdown Checkboxes
• Markdown Emoji
• Markdown Footnotes
• Markdown yaml Preamble

My settings relevant to Markdown are:

{
  "markdown.extension.print.absoluteImgPath": false,
  "markdown.extension.print.onFileSave": true,
  "markdown-preview-github-styles.colorTheme": "dark",
  "markdown.extension.print.theme": "dark",
  "markdown.extension.math.enabled": false
}

I use the Markdown All in One extension primarily to print my Markdown documents to HTML. In version 2.0.4 of Markdown Preview Github Styling, all my documents print to HTML as expected as shown in the screenshot below.

However, version 2.1.0 of Markdown Preview Github Styling seems to have broken this. The same sample document now prints as:

The raw Markdown of this sample document is:

# Wikipedia - Ring

In mathematics, rings are algebraic structures that generalize fields: multiplication need not be commutative and multiplicative inverses need not exist. Informally, a ring is a set equipped with two binary operations satisfying properties analogous to those of addition and multiplication of integers. Ring elements may be numbers such as integers or complex numbers, but they may also be non-numerical objects such as polynomials, square matrices, functions, and power series.

Formally, a ring is a set endowed with two binary operations called addition and multiplication such that the ring is an abelian group with respect to the addition operator, and the multiplication operator is associative, is distributive over the addition operation, and has a multiplicative identity element. (Some authors define rings without requiring a multiplicative identity and instead call the structure defined above a ring with identity. See § Variations on the definition.)

Whether a ring is commutative has profound implications on its behavior. Commutative algebra, the theory of commutative rings, is a major branch of ring theory. Its development has been greatly influenced by problems and ideas of algebraic number theory and algebraic geometry. The simplest commutative rings are those that admit division by non-zero elements; such rings are called fields.

For now, my solution is to rollback the extension to version 2.0.4. I looked into the generated HTML, and the correct HTML has some CSS saying margin-bottom:16px on relevant pieces of the document, while the incorrect HTML does not include this.

I know interactions between extensions are not necessarily easy to predict, but I was hoping someone could shed some light on this issue. Thank you.

[jjspace]

github switched to using more css variables for spacing and padding including that one for paragraphs. The version of generate-github-markdown-css this now uses in 2.1.0 accounts for and relies on those variables. I don't know how Markdown All In One is generating the html and including CSS but it's missing those somehow.

Probably worth opening an issue on their side given it's dependent on how they handle the html export of css. Might be able to do something to help it on this side but probably need guidance from them since this extension is working correctly in the preview panel.

[mjbvz]

Yes I think this will need to be fixed by markdown all in one since it sounds specific to their extension's functionality