Style Guide

The biggest headline.

Mauris blandit aliquet elit, eget tincidunt nibh pulvinar a. Vestibulum ac diam sit amet quam vehicula elementum sed sit amet dui. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ac diam sit amet quam vehicula elementum sed sit amet dui.

Sed et libero eros. Praesent quis ipsum massa, nec aliquet tellus. Etiam purus neque, varius eget elementum vel, hendrerit id enim. Vestibulum non ultricies dui. Donec bibendum accumsan ligula sit amet consectetur. Proin mattis sapien eget enim cursus in mattis dui rhoncus. Aenean suscipit vehicula urna. Praesent eget nisl libero. Pellentesque accumsan lacus vel lorem euismod non posuere ipsum fringilla

Two columns content

Nullam tincidunt euismod eros. Nullam sodales, tortor vel lacinia varius, orci urna consectetur neque, sit amet accumsan lacus augue at eros. Nullam pellentesque vel mi nec congue. Donec sit amet auctor erat. In hac habitasse platea dictumst.
Aenean arcu nibh, auctor vitae elit nec, ultrices auctor elit. Nam pulvinar dignissim leo eget egestas. Curabitur nec arcu mollis, ultrices lacus vel, mollis est. Nunc id elit metus. Suspendisse ac lacus ut lacus cursus euismod ut et felis.

Dropcap paragraph

Pultrices auctor elit. Nam pulvinar dignissim leo eget egestas. Curabitur nec arcu mollis, ultrices lacus vel, mollis est. Nunc id elit metus. Suspendisse ac lacus ut lacus cursus euismod ut et felis tortor vel lacinia varius, orci urna consectetur neque, sit amet accumsan lacus augue at eros. Nullam pellentesque vel mi nec congue. Donec sit amet auctor erat. In hac habitasse platea dictums. Aenean suscipit vehicula urna. Praesent eget nisl libero. Pellentesque accumsan lacus vel lorem euismod non posuere ipsum fringilla.

The whole t-shirt story began it’s life in 2005, through a small scope of people who would preorder the tee’s as they circled around in an email attach.

Jonathan Doe
So if you ever need anything like, let's say, Ultimate Awesome WordPress Premium Themes, please visit this link

Smaller headline

Donec sollicitudin molestie malesuada. Mauris blandit aliquet elit, eget tincidunt nibh pulvinar a. Vivamus magna justo, lacinia eget consectetur sed, convallis at tellus. Donec rutrum congue leo eget malesuada. Nulla quis lorem ut libero malesuada feugiat. Proin eget tortor risus. Curabitur aliquet quam id dui posuere blandit. Sed porttitor lectus nibh. Donec sollicitudin molestie malesuada. Donec rutrum congue leo eget malesuada.

Smallest headline

Nam id nisl mauris. Quisque auctor metus sit amet risus dignissim blandit. Fusce enim augue, ullamcorper quis urna id, condimentum laoreet mi. Vestibulum pretium consectetur scelerisque. In pharetra, lorem hendrerit congue placerat, eros risus molestie libero, fermentum rhoncus nisl arcu in dolor.

Image alignment

post9The rest of this paragraph is filler for the sake of seeing the text wrap around the 150x150 image, which is left aligned. As you can see the should be some space above, below, and to the right of the image. The text should not be creeping on the image. Creeping is just not right. Images need breathing room too. Let them speak like you words. Let them do their jobs without any hassle from the text. In about one more sentence here, we'll see that the text moves from the right of the image down below the image in seamless transition. Again, letting the do it's thang. Mission accomplished!

And now we're going to shift things to the right align. Again, there should be plenty of room above, below, and to the left of the image. Just look at him there... Hey guy! Way to rock that right side. I don't care what the left aligned image says, you look great.

Don't let anyone else tell you differently. In just a bit here, you should see the text start to wrap below the right aligned image and settle in nicely. There should still be plenty of room and everything should be sitting pretty. Yeah... Just like that. It never felt so good to be right.

One big great image

Okay, we’re done with the fun part and pretty images, now let’s get on to business. Yup, it’s that time for tables and lists folks.

Tables

Employee Salary
John Doe $1 Because that's all Steve Jobs needed for a salary.
Jane Doe $100K For all the blogging she does.
Fred Bloggs $100M Pictures are worth a thousand words, right? So Jane x 1,000.
Jane Bloggs $100B With hair like that?! Enough said...

...or

Lists

  • List item one
    • List item one
      • List item one
      • List item two
      • List item three
      • List item four
    • List item two
    • List item three
    • List item four
  • List item two
  • List item three
  • List item four

and Ordered List (Nested)

  1. List item one
    1. List item one
      1. List item one
      2. List item two
      3. List item three
      4. List item four
    2. List item two
    3. List item three
    4. List item four
  2. List item two
  3. List item three
  4. List item four

...even some on-page coding

.post-title {
	margin: 0 0 5px;
	font-weight: bold;
	font-size: 38px;
	line-height: 1.2;
	and here's a line of some really, really, really, really long text, just to see how the PRE tag handles it and to find out how it overflows;
}

Thanks for scrolling!