Click on the button to copy the text from the text field. Try to paste the text (e.g. ctrl+v) afterwards in a different window, to see the effect.

The options are:-

Contain

See the whole image, shrunk to fit the container height with blanking at the side.

Cover

Fill the container, expanding the image to the container width, with some cropping.

Stretch

Use 100% both height and width to stretch the image aspect to match the container. You see the whole image, fill the whole container, but have image distortion.

Frame Aspect

Alter the aspect ratio of the frame to match that of the image.

Picture Aspect

Use a different picture with an aspect ratio that matches the frame.

https://www.sitepoint.com/community/t/how-to-make-an-image-fit-proportionally-in-flexbox-item-or-in-sections/385308?u=sama74

Copy text

Copy text

Copy text

Open Collapsible

Lorem ipsum...

.some-box {
	width: 20px;
	height: 20px;
	background: black;
	margin-bottom: 1.5rem;
}