Problem description

Display a responsive list of blog preview cards. Each card shows a title and a paragraph of preview text. The preview should be truncated after four lines with an ellipsis, maintaining consistent card heights regardless of content length.

Goal

Truncate the preview content to four lines inside a grid of responsive blog cards while maintaining visual alignment.

Constraints

• Clamp the paragraph to four lines only.

• The layout should adapt to screen width using CSS Grid.

• Use only HTML and CSS.

Sample visual output

Here’s what the output would look like:

Good luck trying the problem! If you’re unsure how to proceed, check the Solution.