What does this do "width: 100%;" when used with min-width with absolute value?

HTML-CSS
1

.wrapper {
width: 100%;
min-width: 20em; /* Will be AT LEAST 20em wide */
}

What does width: 100%; do and why is it necessary here ?

2

width: 100% means take up entire available space that is available to it

and min-width: tells you to take up at least ‘that amount’ of space no matter what or possible

another important thing to note here is that and im quoting form that article

min-width property always overrides the width property whether followed before or after width in your declaration

and another quote from that article

best way to use min-width is to define a width value as a percentage and use an absolute value for the min-width property otherwise using a percentage value for for both min-width and width will not produce the expected result