Boogeymen Template

Made by mrbiotech

This would be the first paragraph past the title tags

Welcome to Box Style 1!

To-do list items:

  1. Change boxes CSS such that:
    • H2:FIRST-CHILD is used to make the top edges.
    • Will that work with less-compliant browsers? Maybe just use this for BOX3 since the others look alright without a bottom edge.
    • Box BG is the lower-right corner over white BG
    • Try adding just a hint of shading to the top and bottom borders.
    • Insert IMGLEFTs and IMGRIGHTs to see how they turn out.
    • OVERFLOW is really weird... fix it!
  3. Fix that bustagated FOOTER!!!
  4. VALIDATE both the CSS and XHTML
  5. Fix Ordered lists!
  6. Fix UNordered lists!

And this would be the paragraph contents themselves. Lets see how well the width is handled, in particular.This is some EM element text, just in case I have to resort to using 4 elements to render this box, although I'd really hate to.

Welcome to Box Style 2!

And this would be the paragraph contents themselves. Lets see how well the width is handled, in particular.

Box Style 2 breaks when any more than 1 paragraph are present. Additional paragraphs could theoretically bork the design? Or no? Do I have this really backwards?

Welcome to Box Style 3!

And this would be the paragraph contents themselves. Lets see how well the width is handled, in particular.

I'm having a lot of trouble trying to get the left side and bottom right corner of this box put in the proper places.

Here's the way I've got the graphics layed out so far...

  1. Ghost: Box3 container
  2. Left edge: ?
  3. Right Corner: ?

Herbs in Harmony

Headache Relief with Peppermint Essential Oil

This is the first generic paragraph

Used as a general tonic worldwide, Peppermint is renowned for its ability to help soothe headache discomfort. It is blended here with soothing Honey and Vanilla, both highly regarded for their ability to comfort the mind.

Maecenas dignissim aliquet odio. Phasellus semper nisl eu enim. Curabitur in velit a augue ullamcorper congue. Ut eget ante. Nunc tristique massa a neque. Curabitur justo. Ut neque lectus, pretium non, congue quis, fringilla et, orci. Aliquam metus. Morbi pellentesque mi vel velit. Nulla neque justo, tristique at, tempus sit amet, vulputate in, ante.

Cras vitae ipsum vitae leo varius elementum. In nibh mi, luctus non, euismod et, convallis ac, tortor. Nam ultricies velit vel massa. Aenean in justo id dui gravida ultrices. Cras pretium accumsan sem. Morbi imperdiet. Nam turpis. Fusce tincidunt est cursus dui. Nam quis diam ut risus faucibus tristique. Integer turpis libero, porttitor ultrices, dapibus quis, malesuada in, dolor. Nunc non lacus nec ante congue facilisis.

Header 2 - mrb_simple1.html

This is a paragraph of text. I could've insulted you by putting that lame Lorem ipsum dolor sin amet crap, but thought the better of it. This is a single-page XHTML-strict standards compliant XHTML template ready for adaptation to your favorite CMS/blahhhg software. It's rather minimal, but that's the point.

If you never wrote it down, it never happened. — Some thriller author

Personally, I think it's more suitable for simple FAQ, Legal Statement or Documentation pages.

Here is an example of an inline quote element: This is a use of the infamous <q> element!

Header 3

Here are some of the features of this simple little template (in an un-ordered list):

Header 3 - More styled examples

Name Gaming Platform Operating System
George Washington Homebrew PS2 Gentoo or Debian
Thomas Jefferson Nintendo Wii Mac OS X

Here's an ordered list:

  1. Chunky, meaty bacon is really frickin' tasty.
  2. This template constructed with 100% love, 0% hate.
  3. Ah shore doo luv dem frahd tay-ters!
  4. Sorry, outty of non-witty banter.

This final paragraph element is what triggers the p:last-child CSS style to make the hanging dude underneath the box.