What is the difference between CSS fit-content and max-content?

Question

I\'m following this article https://css-tricks.com/almanac/properties/w/width/ to try to understand how this rules work.

I have this example:

Answer 1

the one scenario in which max-content and fit-content don't behave the same way is when you set a 'max-width' property on the element, and the viewport size is narrower than the max-width value. in this case the 'max-content' value will result in a layout in which the text will be cut arbitrarily (and the only way to see the entire text is to scroll horizontally). using the 'fit-content' value, on the other hand, will ignore the max-width property and adjust the text nicely inside the viewport.