A small React component rendering a <video/> with object-fit: cover, or a Fallback if object-fit is not available.

React component that render <img> with nicer interface

Generate the object-position value to capture an image's focal point given a custom aspect-ratio.

Just the math behind object-fit and object-position

A polyfill for the background-image cover effect combined with responsive image behaviour with the `<img>` or `<picture>` element.

⚛️ React Project - How to create Full screen & responsive video background in REACT - How to guide tutorial 👉 https://frnt-end.github.io/React-Responsive-Video/

Image object-fit and object-position utilities

I built a pretty travel landing page using HTML & CSS basics. Therefore, I implemented a HTML semantic strucure with convenient navigation bar and a logo. I also worked on the CSS layout of the website, using flexbox and the grid. Besides that, I imported normal images and background images as well. Then, I created a header positioned above the background image thanks to the positioning elements concept. Finally, I applied the default document flow and broke this default view with position absolute and position fixed. But, that's not it: I used selected properties, such as object fit to style the images properly...

mock css object-fit with canvas and support rotate

A lightweight, dependency-free object-fit polyfill.

An user-interface (UI) design by using plain HTML and CSS, without using any library or frameworks.

Desenvolvendo minhas habilidades HTML e CSS.

Vanilla JS library that's all about images: lazy loading, spacer generating, svg to inline...

Nesse modulo foram abordados os temos de flexbox, grid, animações, transições, object-fit | position, fontes web, efeito de texto, view port | grid e media queries.

Object-fit alternative only for IE. It helps to fit the image into the containers.

Responsive SVG "polyfill" for object-fit and object-position.

Webkit sass ui module media wrapper.