Skip to content

Latest commit

 

History

History
203 lines (162 loc) · 9.12 KB

File metadata and controls

203 lines (162 loc) · 9.12 KB

Fill-in lines & inline HTML in PDFs

Markdown alone can't express everything a printed form or court filing needs — a signature line, a "Name: ______" blank, a two-column caption, a centred title block. Markdown Studio's PDF renderer understands a small, deliberate subset of inline HTML/CSS so those documents come out right when you print or export to PDF, while the source stays plain Markdown that an AI assistant can read and edit.

Scope: this page describes what the PDF renderer supports (the Print / Export PDF preview tab). The on-screen Markdown preview may render these snippets more plainly — judge the result in the print preview.

Quick reference

Construct Renders as
<u>text</u>, <ins>text</ins> Underlined text
<del>text</del> Struck-through text
<br> Line break
<span style="border-bottom:…"> (no text) A fill-in blank line
<span style="color:…; font-weight:…">text</span> A styled inline label
<span style="color:transparent">…</span> Redacted (invisible) text
<div style="border-bottom:…"></div> A block signature line
<div style="text-align:center">…</div> Aligned block text
<div style="display:flex">…</div> Divs laid out side by side (a row)
<div style="page-break-before:always"></div> Forces a new page
<table>…</table> A table, with per-cell colours and alignment

Fill-in blanks (inline <span>)

A span with a visible border-bottom and no real text renders as a blank line sitting on the text baseline — the classic fill-in field:

Name: <span style="display:inline-block; min-width:150px; border-bottom:1px solid #555;"> </span>
Date: <span style="display:inline-block; min-width:108px; border-bottom:1px solid #555;"> </span>

Details the renderer honours:

  • Widthwidth or min-width in px, pt, or % (percentages are resolved against the line width). If both are given, the larger wins. With no usable width, the blank defaults to 108 pt (about 1.5 inches). width:0 (or width:0%) deliberately collapses the span to nothing.
  • Border — the border-bottom shorthand and the border-bottom-width/-style/-color longhands are all parsed. A border with style:none/hidden, zero width, or a transparent colour counts as invisible (so the span is not treated as a blank). Very thin borders are drawn at a minimum of 0.6 pt so they survive printing.
  • Colour — a border with no colour of its own uses the surrounding text colour.

Styled labels (inline <span> with text)

A span with text becomes a styled run inside the paragraph:

Status: <span style="color:#c00; font-weight:bold;">OVERDUE</span>

Supported properties: color, font-weight (bold or numeric ≥ 600), font-style: italic, font-size, and text-decoration: underline / line-through (combined with any surrounding decoration).

Redaction: color: transparent hides the text while keeping its space — on a span itself or inherited from a wrapping span. Combined with a visible border-bottom it draws the blank without the text.

Spans nest (inner spans inherit the outer style), uppercase <SPAN> works, HTML entities in prose are decoded (&amp;&, &nbsp; → space), and stray, unclosed, or self-closing span tags are stripped rather than leaking into the output.

Block layout (<div>)

A <div> on its own line(s) is a block-level element:

  • Signature line — an empty div with a visible border-bottom draws a standalone rule:

    <div style="width:40%; border-bottom:1px solid #000;"></div>
    <div>Respondent's signature</div>
  • Alignmenttext-align: left | center | right | justify on a div with text aligns it across the page (e.g. a centred court title block).

  • Rowsdisplay:flex on a wrapper div lays its child divs out side by side; flex-direction: column stacks them instead, and justify-content maps to the row's alignment. Child widths can be fixed lengths or percentages (percentages become proportional flex). This is how a two-column court caption (party names left, case number right) is built:

    <div style="display:flex;">
      <div style="width:60%;">JANE DOE,<br>Petitioner</div>
      <div style="width:40%; text-align:right;">Case No. 12-3456</div>
    </div>

    Wrapper divs nest: a div containing more divs recurses into a column or row, and children inside a row shrink to fit rather than overflowing. Inner <b> tags and HTML entities are handled.

Tables (<table>)

Markdown's pipe tables can't colour a cell, centre a column, or bold one entry — so a raw-HTML <table> renders through the same table renderer, honouring a small set of per-cell styles:

<table>
<thead><tr><th>Category</th><th style="text-align:center;">Legal in TX</th></tr></thead>
<tbody>
<tr><td>Section 47 time-charge app</td><td style="background:#f2ff49; font-weight:700; text-align:center;">Yes</td></tr>
<tr><td>Regulated commercial online</td><td style="text-align:center;">No &mdash; not licensed</td></tr>
</tbody>
</table>

Details the renderer honours:

  • Structure<thead> / <tbody> / <tfoot> sections, or a bare list of <tr>s. With no sections, a leading row of all-<th> cells becomes the header. Header rows get the profile's brand fill and white text, exactly like a pipe table's header.
  • Cell stylesbackground / background-color (the fill stretches to the full row height), color, font-weight (bold or numeric ≥ 600), and text-align. A cell's own colour overrides the header's white.
  • Cell content<strong>/<b>, <em>/<i>, <u>/<ins>, <del>/<s>, <code>, <a>, <img>, plus Markdown-style <span> labels, <br> and HTML entities. Stray or unbalanced tags are dropped rather than leaked.
  • Prose around it — text sharing the block with the table (before or after) still renders as its own paragraph.
  • Not supportedcolspan / rowspan (each cell occupies one grid slot), nested tables, per-row or per-column styling that isn't on the cell, and CSS beyond the four properties above. A <table> inside a fenced code block stays literal, as always.

A pipe table remains the better choice when you don't need any of this — it's far easier to edit. Reach for HTML only for the cells Markdown can't express.

Page breaks

A bare <div> (empty or self-closing) or <hr> carrying a page-break directive forces a new page — the classic use is starting the Certificate of Service on its own page:

<div style="page-break-before:always"></div>

#### <u>CERTIFICATE OF SERVICE</u>

Details:

  • Accepted directives: page-break-before: always, page-break-after: always, and the CSS-3 fragmentation spellings break-before: page / break-after: page. A trailing !important is tolerated.
  • The element itself prints nothing — unless it is also visible in its own right (e.g. a signature line with a border-bottom plus the directive), in which case it breaks on the side the directive names and still renders.
  • Only bare, top-level elements break. A content-carrying div never becomes a page break, and a break div nested inside a wrapper div is ignored (the wrapper renders normally).
  • A plain Markdown --- divider is unaffected — it stays a horizontal rule.

Legal-mode pagination

With a legal-mode profile (e.g. the built-in Court Filing), body paragraphs and list items flow across page boundaries: a paragraph that doesn't fit the remaining space splits at a line and continues on the next page, so every page fills top to bottom the way a court filing must. Legal mode also sets body text — captions, list markers and plain <div>s included — at a uniform 12pt (Markdown headings keep their own sizes; ##### renders a 12pt bold title) and keeps one continuous double-spaced rhythm across paragraph breaks. Headings, caption rows, signature lines, quotes, tables and images never split.

Limitations

  • Spans wrapping Markdown syntax. When a span wraps Markdown emphasis or a link (e.g. <span style="color:red">**bold**</span>), the Markdown parser splits the tags away from the inner element. The tags never leak and the emphasis still renders, but the span's own colour/weight is not applied to that inner element. Style the plain text directly instead.
  • Entities in code. HTML entities are decoded in prose but left verbatim inside code spans and code blocks (by design).
  • Table spans. colspan and rowspan are ignored — every cell takes one grid slot, so a table that relies on merged cells comes out misaligned.
  • Everything else is text. HTML tags outside this subset are not interpreted by the PDF renderer.

See also

  • Print & branding profiles — fonts, colours, headers/footers, watermarks, and the legal / manuscript layout options (double spacing, justification, first-line indent, centred headings).
  • AI profile authoring — have an AI generate an importable print profile from a plain-English description.