Text Alignment and Spacing
CSS includes a great many properties that let you control how text appears on a web page. If you ever wondered how to indent paragraphs, space out lines, or center a title, these are the tools you need.
Table 6-2 has the details on all your alignment options.
Table 6-2. Alignment and spacing properties.
Property | Description | Common Values | Can Be Inherited? |
|---|---|---|---|
text-align | Lines up text on one or both edges of a page. | left, right, center, justify. | Yes |
text-indent | Indents the first line of text (typically in a paragraph). | A pixel value (indicating the amount to indent) or percentage of the width of the containing element. | Yes |
margin | Sets the spacing around the outside of a block element (HTML Elements for Basic Text). To change the margin on just one side, use the similar properties marginbottom, margin-left, marginright, and margin-top. | A pixel value or percentage indicating the amount of space to add around the element. | No |
padding | Sets the spacing around the inside of a block element. Has the same effect as “margin,” unless you have an element with a border or background color. | A pixel value or percentage indicating the amount of space to add around the element. | No |
wordspacing | Sets the space between words | A pixel value or percentage. | Yes |
letterspacing | Sets the space between letters. | A pixel value or percentage. | Yes |
line-height | Sets the space between lines. | A pixel value or percentage. You can also use a multiple (for example, use 2 for double-spacing). | Yes |
white-space | Tells the browser how to ... |
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Read now
Unlock full access