• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

Chapter 9. Styling Text > Aligning Text

Aligning Text

Back in the days of presentational HTML, text was aligned using the align attribute and a corresponding justification value. CSS uses the exact same premise, but, of course, it's done outside the HTML using the text-align property. The values are the same and should be familiar to anyone who's ever used a word processor:

  • left— Also referred to as ragged right, left justification sets the text flush left with lines breaking to the right. This is default behavior for all browsers and is the preference for all body text. text-align: left;

  • center— This centers the text. Centered text is useful for styling headers, captions, and other accent text. It is very difficult to read long sections of centered text, so it's not best to use for body text. text-align: center;

  • right— This places all text flush right, leaving a ragged left edge. text-align: right;

  • justify— Justifying text means having the left and right edges be equally flush. This is done by calculating words and spacing within the available line length. It's commonly seen in print newspapers and magazines. It can create a very uniform, attractive look, but most people avoid it because the spacing can appear to be very awkward and, therefore, more difficult to read. text-align: justify;


PREVIEW

                                                                          

Not a subscriber?

Start A Free Trial


  
  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint