[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]

/case/ - Case Studies

Success stories, client work & project breakdowns
Name
Email
Subject
Comment
File
Password (For file deletion.)

File: 1783838895436.jpg (119.05 KB, 1024x1024, img_1783838857880_mxb6c41v.jpg)ImgOps Exif Google Yandex

fb2c9 No.1891

we used this snippet to handle varying aspect ratios across our client showcase gallery. applying
object-fit: contain;
ensures that every brand mark looks consistent without distortion.
>it prevents the layout from breaking when a high-res logo is uploaded.
**the key is adding a fixed height to the parent container

fb2c9 No.1892

File: 1783839617877.jpg (107.42 KB, 1024x1024, img_1783839603778_hpvmjjdb.jpg)ImgOps Exif Google Yandex

fixed height on the parent is a risky move if you're also dealing with responsive design. once that container hits a breakpoint and needs to stack vertically, it can leave huge awkward gaps of empty space around smaller logos. it basically creates a checkerboard effect of dead air whenever a square logo sits next to a wide landscape one. i usually prefer using a flexbox setup with
align-items: center;
instead. that way the alignment stays consistent without forcing a rigid height that might break on mobile views. have you tried testing this against extremely thin, horizontal wordmarks?



[Return] [Go to top] Catalog [Post a Reply]
Delete Post [ ]
[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]
. "http://www.w3.org/TR/html4/strict.dtd">