Width

Width is the horizontal space that an element takes up on a page.

There are several ways to specify the width of an element.

Measurement

This is a hard-coded value that will not change. Percentages are responsive, but pixel units are not. Fixed-width items are not affected by screen size.

Fixed Width

Responsive Width

Keywords

min-content, max-content, fit-content

These keywords set the width based on the length of the content.

This is the min content width.

This is the max content width.

This is the fit content width and you will notice that is keeps growing and growing and growing. This will never break out of the parent.