Home A - Z

Blame

4499e1 David Marsh 2026-04-16 05:09:09
1 
# Test
2
3
*markdown test page for this blog*
4
5
This page is used to demonstrate the markup available for this website. This text is set with the yaml metadata variable and will appear above the table of contents.
6
7
See [GitHub Flavored Markdown Spec](https://github.github.com/gfm/) for
8
the format spec.
9
10
This is an orphan paragraph without a title, and will appear directly under the table of contents.
11
12
Title and subtitle
13
------------------
14
15
```
16
---
17
title: test
18
subtitle: markdown test page for this blog.
19
---
20
```
21
22
Not every markup allowed in GFM or HTML is tested though it will
23
probably work. The examples are followed with a code block showing how
24
it was created.
25
26
See
27
[markdown cheatsheet](https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet)
28
for more examples.
29
30
```
31
Not every markup allowed in GFM or HTML is tested though it will
32
probably work. The examples are followed with a code block showing how
33
it was created.
34
35
See
36
[markdown cheatsheet](https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet)
37
for more examples.
38
```
39
40
Table of Contents
41
-----------------
42
43
Include `toc: true` in the yaml metadata of the markdown file.[^toc]
44
45
[^toc]: There's a bug in my code that means `toc: anytext` or `toc: false` will create a toc. For now just set toc to true or leave it out altogether.
46
47
Headers
48
-------
49
50
```
51
Headers
52
-------
53
```
54
55
### Smaller Header
56
57
```
58
### Smaller Header
59
```
60
61
Text
62
----
63
64
Emphasis (italics), use *asterisks* or _underscores_
65
66
```
67
Emphasis (italics), use *asterisks* or _underscores_
68
```
69
70
Strong (bold), use **asterisks** or __underscores__
71
72
```
73
Strong (bold), use **asterisks** or __underscores__
74
```
75
76
Combined emphasis with **asterisks and _underscores_**
77
78
```
79
Combined emphasis with **asterisks and _underscores_**
80
```
81
82
Strikethrough use two tildes ~~strikethrough~~
83
84
```
85
Strikethrough use two tildes ~~strikethrough~~
86
```
87
88
<sup>superscript</sup>, <sub>subscript</sub>, <mark>mark</mark> and <small>small</small>
89
90
```
91
<sup>superscript</sup>, <sub>subscript</sub>, <mark>mark</mark> and <small>small</small>
92
```
93
94
To force a new
95
line, end the line \
96
with a backslash
97
98
```
99
To force a new
100
line, end the line \
101
with a backslash
102
```
103
104
<div align=left>Align text left</div>
105
106
```
107
<div align=left>Align text left</div>
108
```
109
110
<div align=center>Align text center</div>
111
112
```
113
<div align=center>Align text center</div>
114
```
115
116
<div align=right>Align text right</div>
117
118
```
119
<div align=right>Align text right</div>
120
```
121
122
<div align=justify>Align text justify</div>
123
124
```
125
<div align=justify>Align text justify</div>
126
```
127
128
### Colours
129
130
We can't do colours directly in markdown, we have to use HTML style tags.
131
132
<span style="color: red;">This text is red.</span>
133
134
```
135
<span style="color: red;">This text is red.</span>
136
```
137
138
Lists
139
-----
140
141
1. First
142
1. Second
143
1. Third
144
145
```
146
1. First
147
1. Second
148
1. Third
149
```
150
151
* One thing
152
* Two thing
153
* Three thing
154
155
```
156
* One thing
157
* Two thing
158
* Three thing
159
```
160
161
1. lists with
162
163
1. more space
164
165
1. between items
166
167
```
168
1. lists with
169
170
1. more space
171
172
1. between items
173
```
174
175
* lists with
176
177
* more space
178
179
* between items
180
181
```
182
* lists with
183
184
* more space
185
186
* between items
187
```
188
189
* Lists with
190
* Sub items need
191
* To be indented with
192
* Two spaces
193
194
```
195
* Lists with
196
* Sub items need
197
* To be indented with
198
* Two spaces
199
```
200
201
<dl>
202
<dt>Test Term</dt>
203
<dd>Test Definition</dd>
204
<dt>Definition lists</dt>
205
<dd>Are not natively supported in Markdown, use inline HTML instead</dd>
206
<dt>Markdown inside HTML</dt>
207
<dd>Does *not* **work**. Use HTML <em>tags</em> instead</dd>
208
</dl>
209
210
```html
211
<dl>
212
<dt>Test Term</dt>
213
<dd>Test Definition</dd>
214
<dt>Definition lists</dt>
215
<dd>Are not natively supported in Markdown, use inline HTML instead</dd>
216
<dt>Markdown inside HTML</dt>
217
<dd>Does *not* **work**. Use HTML <em>tags</em> instead</dd>
218
</dl>
219
```
220
221
### Orphan Items
222
223
* I'm an orphan item
224
* I am too
225
226
```
227
* I'm an orphan item
228
* I am too
229
```
230
231
### Empty Parent
232
233
*
234
* I have a blank parent
235
* So do I
236
237
```
238
*
239
* I have a blank parent
240
* So do I
241
```
242
243
244
Links
245
-----
246
247
[Lorem ipsum] dolor sit amet, consectetur adipiscing elit.
248
249
[lorem ipsum]: https://en.wikipedia.org/wiki/lorem_ipsum "with hover text"
250
251
```
252
[Lorem ipsum] dolor sit amet, consectetur adipiscing elit.
253
254
[lorem ipsum]: https://en.wikipedia.org/wiki/lorem_ipsum "with hover text"
255
```
256
257
[rdm.sh blog](https://rdm.sh "my blog") ipsum dolor sit amet, consectetur adipiscing elit.
258
259
```
260
[rdm.sh blog](https://rdm.sh "my blog") ipsum dolor sit amet, consectetur adipiscing elit.
261
```
262
263
https://rdm.sh ipsum dolor sit amet, consectetur adipiscing elit.
264
265
```
266
https://rdm.sh ipsum dolor sit amet, consectetur adipiscing elit.
267
```
268
269
Link directly to a [header](#headers) or [smaller header](#smaller-header) in the same document
270
271
```
272
Link directly to a [header](#headers) or [smaller header](#smaller-header) in the same document
273
```
274
275
Link directly to a header in another document [about this blog](about.html#about-this-blog)
276
277
```
278
Link directly to a header in another document [about this blog](about.html#about-this-blog)
279
```
280
281
Footnotes
282
---------
283
284
There is a footnote right here[^1] and here[^here][^note][^markup]
285
[^1]: GNU Terry Pratchett
286
[^here]: or there
287
[^note]: footnote entries must *not* be split over multiple lines
288
[^markup]: You can **add** *markup* in the [footnotes](test.html)
289
290
```
291
There is a footnote right here[^1] and here[^here][^note][^markup]
292
[^1]: GNU Terry Pratchett
293
[^here]: or there
294
[^note]: footnote entries must *not* be split over multiple lines
295
[^markup]: You can **add** *markup* in the [footnotes](test.html)
296
```
297
298
Images
299
------
300
301
### in-place image with caption
302
303
![Philips PM5544 test pattern](test_pattern.webp "There is nothing wrong with your television set. Do not attempt to adjust the picture. We are controlling transmission")
304
305
```
306
![Philips PM5544 test pattern](test_pattern.webp "There is nothing wrong with your television set. Do not attempt to adjust the picture. We are controlling transmission")
307
```
308
309
### in-footer image details
310
311
![Philips PM5544][test]
312
313
[test]: test_pattern.webp "There is nothing wrong with your television set. Do not attempt to adjust the picture. We are controlling transmission"
314
315
```
316
![Philips PM5544][test]
317
318
[test]: test_pattern.webp "There is nothing wrong with your television set. Do not attempt to adjust the picture. We are controlling transmission"
319
```
320
321
### simpler markdown with in-footer image details
322
323
![test]
324
325
[test]: test_pattern.webp "There is nothing wrong with your television set. Do not attempt to adjust the picture. We are controlling transmission"
326
327
```
328
![test]
329
330
[test]: test_pattern.webp "There is nothing wrong with your television set. Do not attempt to adjust the picture. We are controlling transmission"
331
```
332
333
### image as link
334
335
[![Philips PM5544](test_pattern.webp "There is nothing wrong with your television set. Do not attempt to adjust the picture. We are controlling transmission")][Philips PM5544]
336
337
[Philips PM5544]: https://en.wikipedia.org/wiki/File:Philips_PM5544.svg
338
339
```
340
[![Philips PM5544](test_pattern.webp "There is nothing wrong with your television set. Do not attempt to adjust the picture. We are controlling transmission")][Philips PM5544]
341
342
[Philips PM5544]: https://en.wikipedia.org/wiki/File:Philips_PM5544.svg
343
```
344
345
### simpler markdown image as link
346
347
[![test]][Philips PM5544]
348
349
[test]: test_pattern.webp "There is nothing wrong with your television set. Do not attempt to adjust the picture. We are controlling transmission"
350
[Philips PM5544]: https://en.wikipedia.org/wiki/File:Philips_PM5544.svg
351
352
```
353
[![test]][Philips PM5544]
354
355
[test]: test_pattern.webp "There is nothing wrong with your television set. Do not attempt to adjust the picture. We are controlling transmission"
356
[Philips PM5544]: https://en.wikipedia.org/wiki/File:Philips_PM5544.svg
357
```
358
359
Code
360
----
361
362
This para has `code` tags in the middle
363
364
```
365
This para has `code` tags in the middle
366
```
367
368
```bash
369
#!/bin/bash
370
echo "hello world"
371
rsync -avz here there
372
ls -la *
373
```
374
375
````
376
```bash
377
#!/bin/bash
378
echo "hello world"
379
rsync -avz here there
380
ls -la *
381
```
382
````
383
384
```python
385
#!/usr/bin/python3
386
print ("hello world")
387
```
388
389
````
390
```python
391
#!/usr/bin/python3
392
print ("hello world")
393
```
394
````
395
396
```c
397
#include <stdio.h>
398
399
int main(void)
400
{
401
printf("Hello, world!\n");
402
return 0;
403
}
404
```
405
406
````
407
```c
408
#include <stdio.h>
409
410
int main(void)
411
{
412
printf("Hello, world!\n");
413
return 0;
414
}
415
```
416
````
417
418
```html
419
<p>text</p>
420
```
421
422
````
423
```html
424
<p>text</p>
425
```
426
````
427
428
```
429
plain text
430
```
431
432
````
433
```
434
plain text
435
```
436
````
437
438
indent with 4 spaces
439
440
```
441
indent with 4 spaces
442
```
443
444
~~~
445
tilde also work as a code fence
446
~~~
447
448
```
449
~~~
450
tilde also work as a code fence
451
~~~
452
```
453
454
Tables
455
------
456
457
Pipe tables are the only type supported by default.
458
459
| default | left | center | right |
460
| ------- |:---- |:------:| -----:|
461
| d | l | c | r |
462
| this | row | is | even |
463
| this | row | is | odd |
464
| rows hi | ghli | ght on | hover |
465
466
```
467
| default | left | center | right |
468
| ------- |:---- |:------:| -----:|
469
| d | l | c | r |
470
| this | row | is | even |
471
| this | row | is | odd |
472
| rows hi | ghli | ght on | hover |
473
```
474
475
### minimum viable table
476
477
| |
478
-|
479
a|
480
481
```
482
| |
483
-|
484
a|
485
```
486
487
### slightly less minimum table
488
489
I prefer this as at least it looks like a table in the markdown, unlike
490
above which could be confusing.
491
492
| |
493
|-|
494
|b|
495
496
```
497
| |
498
|-|
499
|b|
500
```
501
502
### mixed html table with markdown text
503
504
You can't put markdown inside a html table
505
506
<table>
507
<tr><td>mixed *html*</td><td>_table_ **with**</td></tr>
508
<tr><td>__markdown__ text</td><td>doesn't work</td></tr>
509
</table>
510
511
```html
512
<table>
513
<tr><td>mixed *html*</td><td>_table_ **with**</td></tr>
514
<tr><td>__markdown__ text</td><td>doesn't work</td></tr>
515
</table>
516
```
517
518
### multi-line tables
519
520
This doesn't work:
521
522
| column 1 | column 2 |
523
| -------- | --------- |
524
| value | * value 1 |
525
| | * value 2 |
526
| -------- | ---------- |
527
| value | * value 1 |
528
| | * value 2 |
529
530
```
531
| column 1 | column 2 |
532
| -------- | --------- |
533
| value | * value 1 |
534
| | * value 2 |
535
| -------- | --------- |
536
| value | * value 1 |
537
| | * value 2 |
538
```
539
540
Use ether `ul` or `ol` to get itemised lists, or `br` for newlines:
541
542
| column 1 | column 2 |
543
| -------- | -------- |
544
| value | <ul><li>value 1</li><li>value 2</li></ul> |
545
| value | <ul><li>value 1</li><li>value 2</li></ul> |
546
| value | value 1<br />value 2 |
547
| value | value 1<br />value 2 |
548
549
```
550
| column 1 | column 2 |
551
| -------- | -------- |
552
| value | <ul><li>value 1</li><li>value 2</li></ul> |
553
| value | <ul><li>value 1</li><li>value 2</li></ul> |
554
| value | value 1<br />value 2 |
555
| value | value 1<br />value 2 |
556
```
557
558
### multi-column cells
559
560
afaik, there is currently no way to do this in GFM markdown, unless you use HTML.
561
562
| column 1 | column 2 | column 3 |
563
| -------- | -------- | -------- |
564
| value 1 | value 2 | value 3 |
565
| value 1 | value 2 ||
566
| value 1 || value 2 |
567
|| value 1 | value 2 |
568
| value 1 |||
569
|| value 1 ||
570
||| value 1 |
571
572
```
573
| column 1 | column 2 | column 3 |
574
| -------- | -------- | -------- |
575
| value 1 | value 2 | value 3 |
576
| value 1 | value 2 ||
577
| value 1 || value 2 |
578
|| value 1 | value 2 |
579
| value 1 |||
580
|| value 1 ||
581
||| value 1 |
582
```
583
584
### multi-row cells
585
586
afaik, there is currently no way to do this in GFM markdown, unless you
587
use HTML. See above multi-column cells.
588
589
| First line of the poem |
590
| Second line of the poem |
591
| Third line of the poem |
592
593
### incomplete rows
594
595
Rows lacking the complete markup have no impact.
596
597
| colone | coltwo | colthree | colfour |
598
| --- | --- | --- | -- |
599
| every | col | is | used |
600
| only onecol |
601
| onecol | twocol |
602
| every | col | is | used |
603
| only onecol |
604
605
```
606
| colone | coltwo | colthree | colfour |
607
| --- | --- | --- | -- |
608
| every | col | is | used |
609
| only onecol |
610
| onecol | twocol |
611
| every | col | is | used |
612
| only onecol |
613
```
614
615
Blockquote
616
----------
617
618
> short lines
619
> short lines
620
>
621
> **markdown strong**
622
> short lines
623
624
```
625
> short lines
626
> short lines
627
>
628
> **markdown strong**
629
> short lines
630
```
631
632
> really long lines **markdown strong** really long lines **markdown strong** really long lines **markdown strong** really long lines **markdown strong** really long lines **markdown strong** really long lines **markdown strong**
633
>
634
> really long lines **markdown strong** really long lines **markdown strong** really long lines **markdown strong** really long lines **markdown strong** really long lines **markdown strong** really long lines **markdown strong**
635
636
```
637
> really long lines **markdown strong** really long lines **markdown strong** really long lines **markdown strong** really long lines **markdown strong** really long lines **markdown strong** really long lines **markdown strong**
638
>
639
> really long lines **markdown strong** really long lines **markdown strong** really long lines **markdown strong** really long lines **markdown strong** really long lines **markdown strong** really long lines **markdown strong**
640
```
641
642
Inline HTML
643
-----------
644
645
<em>You</em> can <strong>use</strong> <i>html</i> <b>tags</b>.
646
647
```html
648
<em>You</em> can <strong>use</strong> <i>html</i> <b>tags</b>.
649
```
650
651
Horizontal Rule
652
---------------
653
654
---
655
***
656
___
657
658
```
659
---
660
***
661
___
662
```
663
664
Math
665
----
666
667
This sentence will have an equation inline, here it is $c^2 = a^2 + b^2$
668
it looked like that. Use single dollar signs for inline math.
669
670
```
671
This sentence will have an equation inline, here it is $c^2 = a^2 + b^2$
672
it looked like that. Use single dollar signs for inline math.
673
```
674
675
Two dollar signs and the equation will be on it's own and centered,
676
$$E=mc^2$$ like that. No matter where it appears, even mid sentence.
677
678
```
679
Two dollar signs and the equation will be on it's own and centered,
680
$$E=mc^2$$ like that. No matter where it appears, even mid sentence.
681
```
682
683
Quotes
684
------
685
686
This section is to 'test' "smart quotes", where the quotes make the 66 99 shapes around words.
687
688
```
689
This section is to 'test' "smart quotes", where the quotes make the 66 99 shapes around words.
690
```
691
692
Emoji and HTML entities
693
-----------------------
694
695
See [test emoji](test_emoji.html) for the unicode emoji version
696
supported by [pandoc].
697
698
* &check; &cross; :smile: :x:
699
* https://dev.w3.org/html5/html-author/charref
700
* https://www.webfx.com/tools/emoji-cheat-sheet/
701
702
```
703
* &check; &cross; :smile: :x:
704
* https://dev.w3.org/html5/html-author/charref
705
* https://www.webfx.com/tools/emoji-cheat-sheet/
706
```
707
708
### Whitespace characters
709
710
1. White&nbsp;Space
711
2. White&ensp;Space
712
3. White&emsp;Space
713
4. White&emsp13;Space
714
5. White&emsp14;Space
715
6. White&numsp;Space
716
7. White&puncsp;Space
717
8. White&thinsp;Space
718
8. White&ThinSpace;Space
719
9. White&hairsp;Space
720
10. White&VeryThinSpace;Space
721
11. White&MediumSpace;Space
722
723
```
724
1. White&nbsp;Space
725
2. White&ensp;Space
726
3. White&emsp;Space
727
4. White&emsp13;Space
728
5. White&emsp14;Space
729
6. White&numsp;Space
730
7. White&puncsp;Space
731
8. White&thinsp;Space
732
8. White&ThinSpace;Space
733
9. White&hairsp;Space
734
10. White&VeryThinSpace;Space
735
11. White&MediumSpace;Space
736
```
737
738
See also [Whitespace character](https://en.wikipedia.org/wiki/Whitespace_character)
739
740
Comments
741
--------
742
743
*Note: You have to view page source to see the results in the html
744
output*
745
746
Normal html comment:
747
748
<!-- html comment two dashes -->
749
750
```
751
<!-- html comment two dashes -->
752
```
753
754
Three dashes doesn't seem to make a difference compared to normal html comment:
755
756
<!--- html comment three dashes -->
757
758
```
759
<!--- html comment three dashes -->
760
```
761
762
Don't use the below, it's just here to see what happens:
763
764
<? question marks ?>
765
766
<? multiple lines
767
768
with newline breaks ?>
769
770
```
771
<? question marks ?>
772
773
<? multiple lines
774
775
with newline breaks ?>
776
```
777
778
Below is a link hack which hides the comment completely from the html
779
output:
780
781
[//]: # (link hack)
782
783
```
784
[//]: # (link hack)
785
```
786
787
788
HTML tag and Font test
789
----------------------
790
791
* code <code>!"#$%&'()*+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ[\]^_`abcedefghijklmnopqrstuvwxyz{|}~</code>
792
* em <em>!"#$%&'()*+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ[\]^_`abcedefghijklmnopqrstuvwxyz{|}~</em>
793
* ins <ins>!"#$%&'()*+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ[\]^_`abcedefghijklmnopqrstuvwxyz{|}~</ins>
794
* kbd <kbd>!"#$%&'()*+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ[\]^_`abcedefghijklmnopqrstuvwxyz{|}~</kbd>
795
* mark <mark>!"#$%&'()*+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ[\]^_`abcedefghijklmnopqrstuvwxyz{|}~</mark>
796
* plain !"#$%&'()*+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ[\]^_`abcedefghijklmnopqrstuvwxyz{|}~
797
* pre <pre>!"#$%&'()*+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ[\]^_`abcedefghijklmnopqrstuvwxyz{|}~</pre>
798
* samp <samp>!"#$%&'()*+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ[\]^_`abcedefghijklmnopqrstuvwxyz{|}~</samp>
799
* small <small>!"#$%&'()*+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ[\]^_`abcedefghijklmnopqrstuvwxyz{|}~</small>
800
* strong <strong>!"#$%&'()*+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ[\]^_`abcedefghijklmnopqrstuvwxyz{|}~</strong>
801
* sub <sub>!"#$%&'()*+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ[\]^_`abcedefghijklmnopqrstuvwxyz{|}~</sub>
802
* sup <sup>!"#$%&'()*+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ[\]^_`abcedefghijklmnopqrstuvwxyz{|}~</sup>
803
804
Lorem Ipsum
805
-----------
806
807
Big chunks of text to test paragraph alignment.
808
809
### Plain text
810
811
The following paragaph has default formatting:
812
813
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sed ligula
814
ac felis pretium dictum quis eget turpis. In laoreet dictum ante in
815
vestibulum. Nullam vitae turpis ipsum. Pellentesque ultrices eros
816
diam, aliquet fringilla odio interdum vitae. Maecenas a ipsum pretium,
817
placerat nulla et, convallis nunc. Vivamus eleifend gravida nulla, eget
818
scelerisque massa. In sagittis est elit, elementum sollicitudin tellus
819
tempus id. Suspendisse malesuada lacinia tortor, vel bibendum odio
820
gravida at. Sed condimentum cursus nunc sit amet faucibus. Sed maximus
821
justo dui, in consequat neque faucibus at. Aliquam nec suscipit erat.
822
Etiam sed convallis nibh. Sed at arcu enim.
823
824
### Blockquote
825
826
The following paragaph is a blockquote using `>` at the start of each line:
827
828
> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sed ligula
829
> ac felis pretium dictum quis eget turpis. In laoreet dictum ante in
830
> vestibulum. Nullam vitae turpis ipsum. Pellentesque ultrices eros
831
> diam, aliquet fringilla odio interdum vitae. Maecenas a ipsum pretium,
832
> placerat nulla et, convallis nunc. Vivamus eleifend gravida nulla, eget
833
> scelerisque massa. In sagittis est elit, elementum sollicitudin tellus
834
> tempus id. Suspendisse malesuada lacinia tortor, vel bibendum odio
835
> gravida at. Sed condimentum cursus nunc sit amet faucibus. Sed maximus
836
> justo dui, in consequat neque faucibus at. Aliquam nec suscipit erat.
837
> Etiam sed convallis nibh. Sed at arcu enim.
838
839
### Ragged left
840
841
The following paragaph is contained in a `<div align=left></div>` block:
842
843
<div align=left>Lorem ipsum dolor sit amet, consectetur adipiscing
844
elit. Sed sed ligula ac felis pretium dictum quis eget turpis.
845
In laoreet dictum ante in vestibulum. Nullam vitae turpis ipsum.
846
Pellentesque ultrices eros diam, aliquet fringilla odio interdum vitae.
847
Maecenas a ipsum pretium, placerat nulla et, convallis nunc. Vivamus
848
eleifend gravida nulla, eget scelerisque massa. In sagittis est elit,
849
elementum sollicitudin tellus tempus id. Suspendisse malesuada lacinia
850
tortor, vel bibendum odio gravida at. Sed condimentum cursus nunc sit
851
amet faucibus. Sed maximus justo dui, in consequat neque faucibus
852
at. Aliquam nec suscipit erat. Etiam sed convallis nibh. Sed at arcu
853
enim.</div>
854
855
### Centered
856
857
The following paragaph is contained in a `<div align=center></div>` block:
858
859
<div align=center>Lorem ipsum dolor sit amet, consectetur adipiscing
860
elit. Sed sed ligula ac felis pretium dictum quis eget turpis.
861
In laoreet dictum ante in vestibulum. Nullam vitae turpis ipsum.
862
Pellentesque ultrices eros diam, aliquet fringilla odio interdum vitae.
863
Maecenas a ipsum pretium, placerat nulla et, convallis nunc. Vivamus
864
eleifend gravida nulla, eget scelerisque massa. In sagittis est elit,
865
elementum sollicitudin tellus tempus id. Suspendisse malesuada lacinia
866
tortor, vel bibendum odio gravida at. Sed condimentum cursus nunc sit
867
amet faucibus. Sed maximus justo dui, in consequat neque faucibus
868
at. Aliquam nec suscipit erat. Etiam sed convallis nibh. Sed at arcu
869
enim.</div>
870
871
### Ragged right
872
873
The following paragaph is contained in a `<div align=right></div>` block:
874
875
<div align=right>Lorem ipsum dolor sit amet, consectetur adipiscing
876
elit. Sed sed ligula ac felis pretium dictum quis eget turpis.
877
In laoreet dictum ante in vestibulum. Nullam vitae turpis ipsum.
878
Pellentesque ultrices eros diam, aliquet fringilla odio interdum vitae.
879
Maecenas a ipsum pretium, placerat nulla et, convallis nunc. Vivamus
880
eleifend gravida nulla, eget scelerisque massa. In sagittis est elit,
881
elementum sollicitudin tellus tempus id. Suspendisse malesuada lacinia
882
tortor, vel bibendum odio gravida at. Sed condimentum cursus nunc sit
883
amet faucibus. Sed maximus justo dui, in consequat neque faucibus
884
at. Aliquam nec suscipit erat. Etiam sed convallis nibh. Sed at arcu
885
enim.</div>
886
887
### Justify
888
889
The following paragaph is contained in a `<div align=justify></div>` block:
890
891
<div align=justify>Lorem ipsum dolor sit amet, consectetur adipiscing
892
elit. Sed sed ligula ac felis pretium dictum quis eget turpis.
893
In laoreet dictum ante in vestibulum. Nullam vitae turpis ipsum.
894
Pellentesque ultrices eros diam, aliquet fringilla odio interdum vitae.
895
Maecenas a ipsum pretium, placerat nulla et, convallis nunc. Vivamus
896
eleifend gravida nulla, eget scelerisque massa. In sagittis est elit,
897
elementum sollicitudin tellus tempus id. Suspendisse malesuada lacinia
898
tortor, vel bibendum odio gravida at. Sed condimentum cursus nunc sit
899
amet faucibus. Sed maximus justo dui, in consequat neque faucibus
900
at. Aliquam nec suscipit erat. Etiam sed convallis nibh. Sed at arcu
901
enim.</div>
902
903
### Code
904
905
The following paragaph is contained in a fenced code block using three
906
backticks:
907
908
```
909
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sed ligula
910
ac felis pretium dictum quis eget turpis. In laoreet dictum ante in
911
vestibulum. Nullam vitae turpis ipsum. Pellentesque ultrices eros
912
diam, aliquet fringilla odio interdum vitae. Maecenas a ipsum pretium,
913
placerat nulla et, convallis nunc. Vivamus eleifend gravida nulla, eget
914
```
915
916
and this uses three tildes:
917
918
~~~
919
scelerisque massa. In sagittis est elit, elementum sollicitudin tellus
920
tempus id. Suspendisse malesuada lacinia tortor, vel bibendum odio
921
gravida at. Sed condimentum cursus nunc sit amet faucibus. Sed maximus
922
justo dui, in consequat neque faucibus at. Aliquam nec suscipit erat.
923
Etiam sed convallis nibh. Sed at arcu enim.
924
~~~
925
926
Special cases
927
-------------
928
929
Making sure that edge cases behave as expected
930
931
### images with tables
932
933
Image with a caption followed by a table, this had strange spacing
934
935
![Philips PM5544 test pattern](test_pattern.webp "There is nothing wrong with your television set. Do not attempt to adjust the picture. We are controlling transmission")
936
937
| default | left | center | right |
938
| ------- |:---- |:------:| -----:|
939
| d | l | c | r |
940
941
![Philips PM5544 test pattern](test_pattern.webp "There is nothing wrong with your television set. Do not attempt to adjust the picture. We are controlling transmission")
942
943
This is just plain text
944
945
| default | left | center | right |
946
| ------- |:---- |:------:| -----:|
947
| d | l | c | r |
948
949
The table above is followed by plain text
950
951
### multiple images with no blank lines inbetween
952
953
![Philips PM5544](test_pattern.webp "There is nothing wrong with your television set. Do not attempt to adjust the picture. We are controlling transmission")
954
![Philips PM5544](test_pattern.webp "There is nothing wrong with your television set. Do not attempt to adjust the picture. We are controlling transmission")
955
![Philips PM5544](test_pattern.webp "There is nothing wrong with your television set. Do not attempt to adjust the picture. We are controlling transmission")
956
957
### multiple images with blank lines inbetween
958
959
![Philips PM5544](test_pattern.webp "There is nothing wrong with your television set. Do not attempt to adjust the picture. We are controlling transmission")
960
961
![Philips PM5544](test_pattern.webp "There is nothing wrong with your television set. Do not attempt to adjust the picture. We are controlling transmission")
962
963
![Philips PM5544](test_pattern.webp "There is nothing wrong with your television set. Do not attempt to adjust the picture. We are controlling transmission")
964
965
### multiple images with captions
966
967
![Philips PM5544 test pattern](test_pattern.webp "There is nothing wrong with your television set. Do not attempt to adjust the picture. We are controlling transmission")
968
969
![Philips PM5544 test pattern](test_pattern.webp "There is nothing wrong with your television set. Do not attempt to adjust the picture. We are controlling transmission")
970
971
![Philips PM5544 test pattern](test_pattern.webp "There is nothing wrong with your television set. Do not attempt to adjust the picture. We are controlling transmission")
972
973
### Images in a table
974
975
See [two images side by side](#two-images-side-by-side) below
976
977
Two images side by side
978
-----------------------
979
980
The only way I've found using [pandoc] and html is to put them in a table.
981
982
| | |
983
| :----------------------: | :----------------------: |
984
| ![favicon](favicon.webp) | ![favicon](favicon.webp) |
985
986
```
987
| | |
988
| :----------------------: | :----------------------: |
989
| ![favicon](favicon.webp) | ![favicon](favicon.webp) |
990
```
991
992
This is a very long title to see how it impacts the Table of Contents and how it wraps on the screen
993
----------------------------------------------------------------------------------------------------
994
995
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
996
997
embed youtube video
998
-------------------
999
1000
<iframe width="560" height="315" src="https://www.youtube.com/embed/FCcdr4O-3gE" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
1001
1002
```
1003
<iframe width="560" height="315" src="https://www.youtube.com/embed/FCcdr4O-3gE" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
1004
```
1005
1006
image copyright notice
1007
----------------------
1008
1009
<small>:warning: *The image 'Philips PM5544 test pattern' used on this page by
1010
[Ebnz](https://commons.wikimedia.org/wiki/User:Ebnz) from
1011
[File:Philips_PM5544.svg](https://en.wikipedia.org/wiki/File:Philips_PM5544.svg)
1012
<br />(GFDL v1.2, CC BY-SA 3.0, CC BY 2.5)</small>*
1013
1014
```
1015
<small>:warning: *The image 'Philips PM5544 test pattern' used on this page by
1016
[Ebnz](https://commons.wikimedia.org/wiki/User:Ebnz) from
1017
[File:Philips_PM5544.svg](https://en.wikipedia.org/wiki/File:Philips_PM5544.svg)
1018
<br />(GFDL v1.2, CC BY-SA 3.0, CC BY 2.5)</small>*
1019
```
1020
1021
[pandoc]: https://pandoc.org