Style sample

This is a style sample page, to help me evaluate CSS changes and problems, an idea I first saw on Matt Gemmell’s blog.


Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque leo justo, porta ultrices porttitor in, molestie eu nisl. Proin et urna ut mauris dignissim aliquet. Praesent at mi non erat accumsan rutrum.1 Suspendisse tellus magna, placerat non molestie sed, egestas nec purus. Fusce ac tellus risus, ac venenatis tortor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi iaculis sapien quis nibh sodales eget mattis eros faucibus.2 Sed posuere, sem a convallis luctus, diam est tincidunt lectus, non pharetra felis tellus eget erat. Curabitur mi odio, mollis pellentesque fringilla tincidunt, tincidunt quis eros.3 Fusce in dignissim eros. Morbi sagittis lacus dolor, at vestibulum mauris. Pellentesque euismod faucibus convallis.

This is some italicized text: Etiam mollis eleifend rhoncus.

This is some bold text: Donec condimentum iaculis elit non scelerisque. Praesent dui ipsum, placerat a dignissim at, pharetra volutpat metus.4


Unordered list:

  • Morbi vel mi felis, aliquet faucibus elit.
  • Fusce sollicitudin blandit imperdiet.
  • Fusce quis diam a lectus varius facilisis.
  • Donec fringilla volutpat nunc, non suscipit justo malesuada vel.
  • Sed blandit viverra neque non ultricies.

Spaced list:

  • Fusce sollicitudin blandit imperdiet.

  • Fusce quis diam a lectus varius facilisis.

  • Donec fringilla volutpat nunc, non suscipit justo malesuada vel.

  • Sed blandit viverra neque non ultricies.

  • Morbi vel mi felis, aliquet faucibus elit.

Ordered list:

  1. Phasellus auctor velit et nisi tincidunt volutpat ut id ipsum.
  2. Nulla hendrerit, quam a faucibus tincidunt, erat nunc malesuada sapien, vel sagittis dui tellus eu justo.
  3. Phasellus luctus fermentum urna, quis venenatis enim hendrerit sed.
  4. Aenean dictum aliquet lacus vel mattis.
  5. Vestibulum sollicitudin nisi sit amet dui rutrum ac malesuada mauris blandit.

Blockquote:

Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Praesent mattis accumsan lectus. Fusce turpis neque, ultrices at accumsan nec, mollis id elit. Curabitur eu dui libero.

Aenean vel nisi et dui tristique tincidunt. Vestibulum molestie justo in sem posuere pellentesque. Nunc egestas tortor sed magna porttitor sed faucibus nulla posuere. Suspendisse eros lacus, pretium quis sollicitudin non, varius ut urna.

In consectetur porta magna, ac aliquet elit volutpat vitae. Nullam et augue congue tortor convallis imperdiet. In laoreet risus vitae turpis eleifend accumsan.


Header 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque leo justo, porta ultrices porttitor in, molestie eu nisl. Proin et urna ut mauris dignissim aliquet. Praesent at mi non erat accumsan rutrum. Suspendisse tellus magna, placerat non molestie sed, egestas nec purus.

Header 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque leo justo, porta ultrices porttitor in, molestie eu nisl. Proin et urna ut mauris dignissim aliquet. Praesent at mi non erat accumsan rutrum. Suspendisse tellus magna, placerat non molestie sed, egestas nec purus.

Header 3

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque leo justo, porta ultrices porttitor in, molestie eu nisl. Proin et urna ut mauris dignissim aliquet. Praesent at mi non erat accumsan rutrum. Suspendisse tellus magna, placerat non molestie sed, egestas nec purus.

Header 4

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque leo justo, porta ultrices porttitor in, molestie eu nisl. Proin et urna ut mauris dignissim aliquet. Praesent at mi non erat accumsan rutrum. Suspendisse tellus magna, placerat non molestie sed, egestas nec purus.

Header 5

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque leo justo, porta ultrices porttitor in, molestie eu nisl. Proin et urna ut mauris dignissim aliquet. Praesent at mi non erat accumsan rutrum. Suspendisse tellus magna, placerat non molestie sed, egestas nec purus.

Header 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque leo justo, porta ultrices porttitor in, molestie eu nisl. Proin et urna ut mauris dignissim aliquet. Praesent at mi non erat accumsan rutrum. Suspendisse tellus magna, placerat non molestie sed, egestas nec purus.


This is a line of code text: Suspendisse > tellus > magna, placerat non molestie sed, egestas nec purus. That was a line of code text.

This is a code block:

Donec non aliquet odio. Etiam mollis eleifend rhoncus.
Pellentesque ultrices auctor nibh.
Aenean at orci urna, id mattis lorem.
Suspendisse facilisis tempus leo, quis euismod orci fermentum a.
Donec condimentum iaculis elit non scelerisque.
Praesent dui ipsum, placerat a dignissim at, pharetra volutpat metus.
Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

That was a code block.


Some more complicated Markdown text, from the original Markdown documentation on Daring Fireball:

This is the first level of quoting.

This is nested blockquote.

Back to the first level.

And even more:

This is a header.

  1. This is the first list item.
  2. This is the second list item.

Here’s some example code:

return shell_exec("echo $input | $markdown_script");
  1. This is a footnote. ↩︎

  2. This is another footnote. It is longer because I need it to span multiple lines. Is this long enough? Apparently not, so I need to keep tying some text here to make it even longer. And just a little bit more so it’s almost a paragraph or so. There, that should be good. ↩︎

  3. This is another footnote. It is longer because I need it to span multiple lines. Is this long enough? Apparently not, so I need to keep tying some text here to make it even longer. And just a little bit more so it’s almost a paragraph or so. There, that should be good. ↩︎

  4. One last footnote, just to figure out spacing issues. Also, would be good to have some bold text and some italics text in here. ↩︎