@Femi-Bright
Posted
Hi Wesley, Lucas has already given a comprehensive explanation on max-width/min-width. Let me just add this.
img {width: 500px;}
You are telling the browser that "Hey! come rain, come sunshine, I always want this image to always be 500px even if the viewport width is 320px IDC"
img {max-width: 500px;}
You are telling the browser that "Hey! if there's enough space to make this image 500px fine! else feel free to scale it down as the viewport decreases. I just want it to have a maximum width of 500px"
img {min-width: 500px;}
You are telling the browser that "This should be the minimum width for this image at any viewport but feel free to scale it up if need arises"
Nice, attempt btw
Marked as helpful
@wesleyjacoby
Posted
@Femi-Bright Hi Bright,
This is so incredibly helpful - Thank you so much.
I experimented with setting min and max widths on the container and resized the browser and see exactly what you guys mean now.
This platform is great! :)