Cropping an image using CSS

Is there a way to crop an image to fit only a certain region of it within a container other than using position-relative and absolute (without having to edit/crop the image beforehand).

Of course, I used overflow-hidden property along with object-position but I couldn't position it properly as I wanted.

It isn't for background, I wanted to do it for positioning a logo properly within the nav bar.

How would you guys do it?

For example:

30 comments

Developer Pro

skool.com/developerpro

Learn how to code. Make money. Have fun. Enjoy life.

Leaderboard (30-day)

+233

+99

+85

+81

+78