Search code examples
htmlcssimagetwitter-bootstrapscaling

Scaling an image with bootstrap

I've used Bootstraps row feature and using the code:

<div class="col-md-1">
<img src="1.jpg" />
</div>

I have found that the image will not scale with the columns when zooming in and out.

I have tried using to wrap my image in and this hasn't worked. I tried scaling it manually but it then changes when zooming in and out.

Finally I tried using "Xem" for height and width but this didn't work either.

How could I do this to be able to make it a scalable size to scale with bootstrap columns.

Solution

  • You need to add the class img-responsive to the image tag.

    It's documented under Images on the Bootstrap website

    http://getbootstrap.com/css/#images

    <div class="col-md-1">
    <img class="img-responsive" src="1.jpg" />
</div>