Heights

CSS Style Overview

  • h25
  • h50
  • h75
  • h100
  • h125
  • h150
  • h175
  • h180
  • h185
  • h190
  • h195
  • h200
  • h225
  • up to h800

Height Matters

These height codes will set a box, section, or element to be a specific height between 25 pixels and 800 pixels high, in incriments of 25.  These are best used for boxes or sections with a background image or color set to them. This is also a better way of adding space above and/or below things without using empty paragraphs (hitting the enter key several times). Just use one of these in the row above and/or below instead. 

The examples below are being used on rows with a color wash background for illustration.

Note

These are max heights and will not stretch with more content.  

CSS Style

h100

Some Test Header Text

Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC...

 

CSS Style

h225

Some Test Header Text

Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word in classical literature, discovered the undoubtable source.

 

CSS Style

h375

Some Test Header Text

Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word in classical literature, discovered the undoubtable source.

 

CSS Style

h600

Some Test Header Text

Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word in classical literature, discovered the undoubtable source.

 

CSS Style

h700

Some Test Header Text

Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word in classical literature, discovered the undoubtable source.

 

CSS Style

h800

Some Test Header Text

Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word in classical literature, discovered the undoubtable source.