Make text show either horizontally or vertically with writing-mode CSS Property

Handling Text Different Directions

Created: 2022-10-09


writing-mode: property
Layman Terms: Makes text run either horizontally or vertically
Specifically, It manipulates block-level elements are displayed on the page --
either from:

  • top-to-bottom
  • right-to-left
  • left-to-right

Values of writing-mode: :

  • horizontal-tb: Top-to-bottom block flow direction.
    Sentences run horizontally.

  • vertical-rl: Right-to-left block flow direction.
    Sentences run vertically.

  • vertical-lr: Left-to-right block flow direction.
    Sentences run vertically.