Learn

Text alignment and paragraph width on a page are important things to consider when creating the text layout. When there is too much space between words or the paragraph width is too wide, it makes the text difficult to read. We can avoid this by using the text-align and width properties to set appropriate values like the below example code.

p { text-align: left; width: 400px; }

Generally, it is recommended to align text using left, right, or center values. The justify value can also be used but can cause a decrease in readability because it creates uneven word spacing to create equal line lengths.

Paragraph width can also impact readability. It is recommended to have 45 to 85 characters per line, with the ideal being suggested as 65 characters. In the above example, we set the width using px as the unit of measure. A more appropriate unit for this purpose is the ch unit, with 1ch being equivalent to the width of the zero (0) character. The ch unit also scales with changes in the value of the font-family or font-size property.

Instructions

1.

Inside the .instructions selector ruleset, set the text alignment to left.

2.

Set a minimum width of 45ch and a maximum width of 85ch for elements of the instructions class.

Folder Icon

Take this course for free

By signing up for Codecademy, you agree to Codecademy's Terms of Service & Privacy Policy.

Already have an account?