Briefle words · UI design
Baseline alignment across cards
Making matching pieces of text in neighbouring cards start at the same height so they read as rows.
Say it to an AI
Row of three rental listing cards (photo, title, rating, price). Crop every photo to the same 4:3 aspect ratio with object-fit: cover, never stretched and no letterboxing, so titles, ratings and prices keep baseline alignment across cards.
How an expert would brief the stronger version of “Rental listing cards”.
See it
Try it as a puzzle →Row of recommended stays on a vacation-rental home page.
Why: In B the three titles, ratings and prices line up; in A they sit at three different heights.
Related words
Room 5 · Spacing & layout
Learn “Baseline alignment across cards” in a five-minute lesson