Horizontal Text Alignment - text-align [11/16]

You can align the text horizontally using the text-align property. You have already used it in the Tables course. Its values are:

  1. left aligns the text left
  2. right aligns the text right
  3. center centers the text
  4. justify enables justified text alignment.

Do it
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Horizontal Text Alignment - text-align:</title> </head> <body> <h1>Progressive Enhancement and Responsive Design</h1> <p class="right">A new approach, which has been gaining popularity already, is called responsive or adaptive design.</p> <p class="justify">The idea behind it is to use a set of techniques (i.e., fluid layout, fluid images, CSS media queries) to display a Web page properly on various devices, ranging from a smartphone to a widescreen monitor.</p> </body> </html>
h1 { font-size: 24px; }
HTML Academy

Practice with Text Align

  1. Make the heading centered.
  2. Make the paragraph with the right class right-aligned.
  3. Make the paragraph with the justify class justified.
Theory Check Next