CSS text align horizontal

By default, the text on the web pages is aligned to the left edge of the element in which it is located, but using the text-align property, you can redefine how lines of text align with the element's borders. Let's consider each of the possible values:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Page title</title>
    <style>
      h1 { text-align:center; }
      p.date { text-align:right; }
      p.main { text-align:justify; } /*value justify stretching text in width*/
      p { text-indent:30px; } /*set the indent size for the first line of the paragraph*/
    </style>
  </head>

  <body>
    <h1>Example of text alignment</h1>
    <p class="date">february, 2018</p>
    <p class="main">In addition to aligning the text, the first line of the
	paragraph was set to a small indent. This effect is very useful on pages with
	large amounts of text, making visual perception easier.</p>
  </body>
</html>
Try it »

Note: the text-align property works only with block elements, such as a paragraph or div, aligning all inline content inside them, including images. Applying a property to inline elements such as a link or span will have no effect.

Copying materials from this site is possible only with the permission of the site administration and
when you specify a direct active link to the source.
2011-2018 © puzzleweb.ru

puzinfo@puzzleweb.ru | ruen