📝 Develop your websites and applications with performance in mind. Learn how to create a realistic performance budget; optimize images, code, and file caching; and more.
Did you know that the select element in HTML has a hidden "expanded" mode? 😁 Which can be activated by setting a size attribute.
By default, select creates a drop-down menu. But when you provide a specific value for "size", it creates a vertical list, of the said size. The user can pick one from this.
Here is a demo which illustrates the behaviour of different values for the "object-fit" property in css for image elements and video elements 🖼
This property determines how an image or a video fits inside the boundary of the element. Whether we crop it, shrink it, or add empty bars around.
My favourite value is "cover" which crops the image, and can be pretty helpful when working with images of arbitrary dimensions - such as a gallery application