lorem ipsum dolor sit amet

element demos

this is supposed to be a demo page so we need more elements!

form elements

email

user id (read only)

random disabled input

about me

remember me

is this checkbox inside a element?

choose a cardinal direction:

north

east

south

west

code

below is some code, you can copy it with ctrl-c. Did you know, alert(1) can show an alert in javascript!

body {
  font-family: var(--font-primary);
  font-size: 1em;
  margin: auto;
  padding: 10px;
  max-width: 80%;
  text-align: left;
  background-color: var(--background-color);
  word-wrap: break-word;
  overflow-wrap: break-word;
  line-height: 1.5;
  color: var(--text-color);
}
header {
  background: #cccccc;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-evenly;
  align-items: center;
  text-align: center;
  width: 100%;
  margin: 0 auto;
}

other

here's a horizontal rule and image because i don't know where else to put them.

---

and here's a nicely marked up table!

name	quantity	price
godzilla	2	$299.99
mozilla	10	$100,000.00
quesadilla	1	$2.22

typography

this is a blockquote. Maecenas blandit, quam vel sodales facilisis, urna erat fringilla sem, sed egestas quam erat a ipsum. Morbi fermentum odio felis, ultricies faucibus purus mattis tristique.

lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque dictum hendrerit velit, quis ullamcorper sem congue ac. Quisque id magna rhoncus, sodales massa vel, vestibulum elit. Duis ornare accumsan egestas. Proin maximus lacus interdum leo molestie convallis. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Ut iaculis risus eu felis feugiat, eu mollis neque elementum. Donec interdum, nisl id dignissim iaculis, felis dui aliquet dui, non fermentum velit lectus ac quam. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. this is strong, this is normal, this is just bold, and this is emphasized! and heck, here's a link.

• unordered list item 1
• unordered list item 2
• unordered list item 3

1. ordered list item 1
2. ordered list item 2
3. ordered list item 3

hi

heading 1

heading 2

heading 3

heading 4

heading 5

heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus quis est id arcu pretium vehicula. Nunc sed nisl fermentum, efficitur ipsum in, euismod nunc. Proin pretium nec tortor vitae egestas. Mauris in iaculis enim. Duis eget massa at mi tristique sollicitudin. Sed elementum diam sed diam commodo, sed sollicitudin velit pharetra. In ornare justo vel sem tincidunt tristique. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Mauris faucibus posuere sem, ac ullamcorper mi posuere in.

In interdum, lorem et tincidunt venenatis, velit risus hendrerit dolor, non vestibulum leo eros ut nisi. Sed eget purus congue, sollicitudin diam vel, imperdiet neque. Praesent quis purus vitae nunc bibendum aliquam feugiat vitae magna. Fusce dapibus, nibh ut semper accumsan, neque orci aliquet lectus, vel ullamcorper dolor est ac mauris. Quisque pellentesque pharetra semper. Vestibulum vel risus id lectus convallis dapibus. Etiam in varius elit, nec luctus enim. Integer lectus lorem, commodo ac arcu eget, mollis facilisis urna. Phasellus in cursus mauris. Aenean felis dolor, finibus eu neque vitae, fringilla pellentesque sem. Praesent eleifend interdum erat, nec aliquet turpis pulvinar nec.

Nunc fermentum turpis augue. Etiam finibus ex ut justo aliquam, sit amet lacinia diam pretium. Duis quis rutrum purus. Aenean congue massa sed risus ullamcorper lacinia. Aenean vehicula laoreet elit at dapibus. Cras quis sodales tellus. Aliquam erat volutpat. Aliquam ultricies magna sit amet nisl condimentum molestie. Ut a justo rutrum, efficitur risus et, fringilla diam. Etiam viverra justo ac elit pretium, at vestibulum ipsum tempor. Donec gravida mauris pretium dui imperdiet interdum. Curabitur pharetra a lorem id vulputate. Aliquam at enim ac mi pretium dapibus sit amet eu ligula. Aenean iaculis eu odio at tincidunt. Fusce dignissim nulla eu tincidunt tempor. Aliquam accumsan id magna eu suscipit.

Proin viverra, leo at porttitor vestibulum, arcu augue tincidunt arcu, nec mollis lacus tellus id turpis. Sed id mi egestas, tincidunt est ut, tincidunt urna. Integer in porta urna. Pellentesque elementum ullamcorper augue, id porta diam suscipit semper. Nam iaculis sit amet dui nec tincidunt. Mauris eget lacus vel tortor efficitur tincidunt. Suspendisse tempus lorem magna, at auctor mi pulvinar at. Donec faucibus dui vel maximus laoreet. Proin porttitor placerat commodo.

Quisque nec faucibus dolor. Ut eu rhoncus urna. Suspendisse pulvinar, leo blandit placerat ornare, ipsum ante convallis ex, a placerat sapien dolor id metus. Nullam a sodales orci, vel venenatis risus. Sed tellus dui, dictum eget rhoncus vehicula, efficitur et lorem. Aliquam ac ligula sit amet leo dictum cursus eu non erat. In porttitor turpis nec purus porta, in eleifend augue venenatis. Morbi commodo at nisi et pharetra. Donec nec mattis felis, eu imperdiet lectus. Curabitur pharetra nisl id lacus tempus, non condimentum ex interdum. Proin sed eleifend orci.

Every blog needs a testing page