Text alignment in CSS - Cheat Sheet & Quick Revision

Recall & Review

beginner

What CSS property is used to align text horizontally within an element?

The text-align property is used to align text horizontally inside an element. It controls whether text is left, right, centered, or justified.

beginner

What are the common values for the text-align property?

Common values include:<br>- left: Aligns text to the left edge.<br>- right: Aligns text to the right edge.<br>- center: Centers the text.<br>- justify: Stretches text so both edges align.

intermediate

How does text-align: justify; affect the text layout?

It adjusts the spacing between words so that each line fills the entire width of the container, making both left and right edges straight, like in newspapers.

intermediate

Does text-align affect block-level or inline elements?

text-align affects the inline content inside block-level elements. It controls how inline text and inline elements are aligned horizontally within their container.

beginner

How can you center text inside a <div> using CSS?

Use text-align: center; on the <div>. This centers all inline text and inline elements inside that container horizontally.

Which CSS property aligns text inside an element?

A text-position

B align-text

C text-align

D align-content

text-align is the correct property to align text horizontally.

What does text-align: right; do?

A Aligns text to the left

B Justifies the text

C Centers the text

D Aligns text to the right

It aligns the text to the right edge of the container.

Which value makes text stretch so both edges align evenly?

A justify

B center

C left

D right

justify adjusts spacing so text lines up on both left and right edges.

If you want to center text inside a paragraph, which CSS rule do you use?

A p { center-text: true; }

B p { text-align: center; }

C p { text-position: center; }

D p { align-text: center; }

The correct syntax is text-align: center;.

Does text-align affect block-level elements themselves or the inline content inside them?

A It affects inline content inside block-level elements

B It affects block-level elements themselves

C It affects only images

D It affects margins

text-align controls how inline content inside block containers is aligned.

Explain how the text-align property works and list its common values.

Think about how text lines up inside a box.

Describe a real-life example where you would use text-align: justify; and why.

Imagine reading a printed page with neat edges.