There are lot of ways to make image responsive.
Main property is {max-with |max-height: 100%} to the image
Also useful are {overflow:hidden}
Read about "object-fit" property. With widths, flex and grid-props you can make images responsive without media-queries and bootstraps (it is a little bit extra).
And you can use images as background-image of block (if it is for decoration purpose, isn`t important for content ) and use background-size, background-position and etc
Top comments (4)
There are lot of ways to make image responsive.
Main property is {max-with |max-height: 100%} to the image
Also useful are {overflow:hidden}
Read about "object-fit" property. With widths, flex and grid-props you can make images responsive without media-queries and bootstraps (it is a little bit extra).
And you can use images as background-image of block (if it is for decoration purpose, isn`t important for content ) and use background-size, background-position and etc
Can you tell me in detail?
You can use CSS media queries to make anything responsive...
Checkout w3school doc about media queries here 👇
w3schools.com/css/css_rwd_mediaque...
You can use a grid system with bootstrap