GeoffKnagge.com

Text properties

word-spacing

Valuenormal | length
Initialnormal
Used Withall elements
InheritedYes
example BODY { word-spacing: 1.3em }

letter-spacing

Valuenormal | length
Initialnormal
Used Withall elements
InheritedYes
example BODY { letter-spacing: 1.3em }

text-decoration

Valuenone | [underline || overline || line-through || blink ]
Initialnone
Used Withall elements
InheritedSometimes
example BODY { text-decoration: blink }

vertical-align

Valuebaseline | sub | super | top | text-top | middle | bottom | text-bottom | percentage
Initialbaseline
Used Withall elements
InheritedNo
Percentagesrelative to the 'line-height' of the element
example BODY { vertical-align: middle }
  • baseline: align the baseline or bottom of the element that of the parent
  • middle: align the vertical midpoint of the element with the baseline plus half the x-height of the parent
  • sub: subscript the element
  • super: superscript the element
  • text-top: align the top of the element with the top of the parent element's font
  • text-bottom: align the bottom of the element with the bottom of the parent element's font
Another set of properties are relative to the formatted line that the element is a part of:
  • top: align the top of the element with the tallest element on the line
  • bottom: align the bottom of the element with the lowest element on the line

text-transform

Valuecapitalize | uppercase | lowercase | none
Initialnone
Used Withall elements
InheritedYes
example BODY { text-transform: capitalize }
  • capitalize : capitalises the first character of each word
  • uppercase : capitalises all letters of the element
  • lowercase : lowercases all letters of the element
  • none : neutralizes inherited value.

text-align

Valueleft | right | center | justify
Used Withblock level elements
InheritedYes
example H1 { text-align: center }

text-indent

Valuelength | percentage
Initial0
Used Withblock level elements
InheritedYes
Percentagesrelative to parent element's width
example P { text-indent: 3em }

line-height

Valuenormal | number | length | percentage
Initialnormal
Used Withall elements
InheritedYes
Percentagesrelative to the font size of the element

This sets the distance between two adjacent baselines.
number specifies a multiple of the font size, and it can be inherited by other elements.
percentages are inherited as the calculated value.

Negative values may not be used.

The following have the same effect:
  P { line-height: 1.7; font-size: 10pt }       /* number */
  P { line-height: 1.7em; font-size: 10pt }   /* length */
  P { line-height: 170%; font-size: 10pt }    /* percentage */
(C)opyright, Geoff Knagge.
Continued use of this site indicates your agreement to the Conditions of use and Privacy Policy.