Flexbox image responsive

Hello, does Flexbox make an image responsive or is it necessary to use something else to make that work? My image is retaining its size while everything else is changing. I must not be reading the right material as I can’t find the answer. if someone could point me in the right direction I would appreciate it.


using % on your image and its container div width will make your image responsive, flex is used more to move the position of the image when the screen size changes

Flexbox only controls the layout position and direction of its child elements, nothing else. To make an image responsive, set its width to a percentage (usually 100%). You may also have to set the width of one or more of its parent elements as well, including the flexbox container.

When setting an image’s width in percent, be sure to give it a sensible max-width as well.

1 Like