Techniques for WCAG 2.0

On this page:

-

# C19: Specifying alignment either to the left OR right in CSS

## Applicability

All technologies that support CSS

This technique relates to:

- Success Criterion 1.4.8 (Visual Presentation)
  - How to Meet 1.4.8 (Visual Presentation)
  - Understanding Success Criterion 1.4.8 (Visual Presentation)

## Description

This technique describes how to align blocks of text either left or right by setting the CSS `text-align` property.

## Examples

### Example 1

In the following example, text is aligned left. In the style sheet, define the class:

Example Code:

    p.left {text-align: left}

In the content call the up the class.

Example Code:

    <p class="left"> Lorem ipsum dolor sit …</p>

### Example 2

In the following example, text is aligned right.

Example Code:

    p.right {text-align: right}

In the content call the up the class.

Example Code:

    <p class="right"> Lorem ipsum dolor sit …</p>

## Tests

### Procedure

1. Check that the text is aligned either left or right.

### Expected Results

- Check #1 is true.

- Top
- Contents
- Intro
- Previous: Technique C18
- Next: Technique C20