1. Code Fence (block, multi-line)

``` cats kittens purr ```

2. Inline Code (inline, single-line)

`cats`

3. Blockquote (block, multi-line)

> cats > kittens > purr

HTML Inline (works in Obsidian preview)

4. Inline <span> with border

<span style="border:2px solid #999; padding:.2rem .5rem; border-radius:.4rem; display:inline-block;"> cats </span>

5. Block <div> with border

<div style="border:2px solid #999; padding:.6rem .8rem; border-radius:.5rem; display:inline-block;"> cats<br>kittens<br>purr </div>

6. One-cell HTML table

<table style="border-collapse:collapse;"> <tr><td style="border:2px solid #999; padding:.6rem .8rem;"> cats<br>kittens<br>purr </td></tr> </table>

7. Styled <pre> (not code-styled)

<pre style="border:2px solid #999; padding:.6rem .8rem; border-radius:.4rem; white-space:pre-wrap; font-family:inherit; background:none;"> cats kittens purr </pre>

With Your Own CSS Class

(Add once in Obsidian’s obsidian.css or snippet)

.box { display:inline-block; border:2px solid #999; border-radius:.5rem; padding:.6rem .8rem; }

Then use:

8. Inline <span>

<span class="box">cats</span>

9. Block <div>

<div class="box"> cats<br>kittens<br>purr </div>

Math Rendering (if Obsidian’s math is on)

10. Inline Box

$ \boxed{\text{cats}} $

10a. Inline Box 2

$ \boxed{\text{cats}} $

11. Display Box

$$ \boxed{\text{cats}} $$

Other Tricks

12. GitHub-style Callout (some themes)

> [!NOTE] > cats > kittens > purr

13. Pandoc Fenced Div (if supported)

::: box cats kittens purr :::