Menu
I just downloaded the source code for Bootstrap 4 alpha 2 and can't find the class img-responsive in it. It exists in Bootstrap 3 source code and I can find it with Notepad++ but in Bootstrap 4s bootstrap.css in dist folder it doesn't exist.
What happend to it??
219
To make an image responsive in Bootstrap, add a class . img-responsive to the <img> tag. This class applies max-width: 100%; and height: auto; to the image so that it scales nicely to the parent element.
Responsive images automatically adjust to fit the size of the screen. Create responsive images by adding an . img-responsive class to the <img> tag. The image will then scale nicely to the parent element.
img-responsive class is used for making images responsive as compared to img-fluid in Bootstrap 4.
To make an image responsive, you need to give a new value to its width property. Then the height of the image will adjust itself automatically. The important thing to know is that you should always use relative units for the width property like percentage, rather than absolute ones like pixels.
From the Bootstrap 4 documentation:
Images in Bootstrap are made responsive with .img-fluid. max-width: 100%; and height: auto; are applied to the image so that it scales with the parent element.
101
Bootstrap 3: .img-responsive
Bootstrap 4: .img-fluid
As in Bootstrap 4 Images:
Images in Bootstrap 4 are made responsive with .img-fluid. max-width: 100%; and height: auto; are applied to the image so that it scales with the parent element.
<img class="img-fluid" src="" alt=""> //This will make your image responsive
It seems you need to use a new class img-fluid instead of img-responsive if you are using Bootstrap 4 alpha 2. Have a look at : http://v4-alpha.getbootstrap.com/content/images/
5
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
