The offset-distance property is used to specify the position along the offset-path. It accepts the following values: “length” and “percentages”. The default value is 0. Negative values are valid. This offset property is an experimental technology. In early versions of the specification, this property was called motion-offset. Initial Value 0 Applies to Transformable elements. Inherited No. Animatable Yes.…

The offset-anchor property defines the anchor point of a box along the offset path. An offset path is considered to be either a geometry of a basic shape that hasn’t been styled or a path consisted of one or more sub-paths. The anchor point specifies the point of the box which is the point that is moved…

The offset property animates an element along the specified path. It is a shorthand property for the following properties: The offset property was called “motion” in the earlier specification. This property is an experimental technology. Initial Value auto none 0 auto auto Applies to Transformable elements. Inherited No. Animatable Yes. Version Motion Path Module Level 1 DOM Syntax Object.style.offset…

The object-position property is used together with the object-fit property to specify how an element should be positioned with x/y coordinates inside its content box. The first value controls the x-axis and the second value controls the y-axis. This property can be specified by a string (left, center or right), or a number (in px or %). Initial Value…

The object-fit property is used to specify how an element should be resized to fit its content box. The object-fit property allows to fit the contents of an image into the dimensions specified in the style sheet. The content can be set to scale up or down, shrink or stretch to fit into the specified width and height with…

The mix-blend-mode property defines the blending of the element’s content with its direct parent background. You need to have background-image, background-color or an <img> for blending it. In CSS, 16 blend modes are available. If a value other than “normal” (default value) is set on an element, a new stacking context will be created on that element. A newly formed group should…

The min-width property sets the minimum width of an element. This property prevents the width property’s value from becoming smaller than the value specified for min-width. Meanwhile, the min-width property overrides width property and CSS max-width property. The property takes a CSS length (px, pt, em, and so on), or a percentage. Initial Value 0 Applies to All elements, but non-replaced inline elements, table rows, and…

The min-height property sets an element’s minimum height. This property prevents the height property’s value from becoming smaller than the value specified for min-height. The min-height property overrides the max-height and height properties. The property takes a CSS length (px, pt, em, etc.) or a percentage. Initial Value 0 Applies to All elements, except non-replaced inline elements, column groups and table columns. Inherited No. Animatable Yes.…

The @media at-rule specifies a set of styles that are applied only to certain media types. Media queries are a popular technique for delivering a responsive web design to desktops, laptops, tablets, and mobile phones. Besides media types, there are media features which have names and accept certain values like properties. But there are differences between properties…