DEV Community

loading...

Quick way to make an image responsive

Dushyant Pathak
Full Stack JavaScript \ GraphQL \ ElasticSearch \ NLP
・1 min read

Add the following to your image's style attribute.

<img style = "width: 100%; height: auto;" src = "some-image-source">
Enter fullscreen mode Exit fullscreen mode

If you want to set a max-width,

<img style = "width: 100%; height: auto; max-width: 200px;" src = "some-image-source">
Enter fullscreen mode Exit fullscreen mode

Cheers! Happy coding!

Discussion (0)