DEV Community

Discussion on: Setting Up Width of Images In CSS

Collapse
 
anduser96 profile image
Andrei Gatej

Thanks for sharing!

By setting max-width of 100% to an image, we are setting the maximum width to 100% of its own size

I've read that: when the value is provided as a percentage, it is relative to the width of the containing block. So, in this case, the containing block refers to the current element, and not to its parent?

Thank you!

Collapse
 
adiatiayu profile image
Ayu Adiati • Edited

Thank you for reading and the feedback, Andrei!

Yes, the containing block refers to the current element.

Let's put aside the percentage for a while and see this with a fixed value of px.
If you scroll down to the example part in the link that you provide, in the "Using Fixed Value", it is explained that

[...] the width of the div tag can not exceed 200px.

This means that when we have a screen with a width of 640px, the width of the div will not getting bigger than 200px (its maximum value).

The explanation of the percentage example also the same.

[...] the width of the div can not exceed 90%.

From here we can see that max-width relatives to the current element.

Hope this helps 😊

Collapse
 
anduser96 profile image
Andrei Gatej

Makes sense! Thank you very much

Thread Thread
 
adiatiayu profile image
Ayu Adiati

Anytime 😄