Урок 25 · CSS

Текст не растягивается на весь экран

Широкий монитор делает строку длиной в полтора экрана. Такую строку теряют на обратном пути.

Почему это следующий шаг

Вертикальный ритм уже одинаковый. Теперь ограничь ширину самого текста.

Как сделать

Абзацу или колонке статьи поставь max-width около 65ch. Единица ch близка к ширине знака «0». Шапка и сетка карточек могут быть шире, длинный текст — нет. Выравнивание по ширине не чинит длинную строку, оно только увеличивает дыры между словами.

.article { max-width: 65ch; }
.lead { max-width: 58ch; }

Что проверить

• На широком экране строка не стала бесконечной.
• На узком экране текст по-прежнему умещается.
• Карточки рядом могут быть шире колонки текста.