Menu
I am using Bootstrap 3.0 dist and I am following some Bootstrap tutorial now, trying to learn how it works. I did everything exactly as in the tutorial (it is for v2, so I changed the classes to v3) and I do not use any custom CSS or anything and in the tutorial the images resize when you simply resize the window, but in mine it stays same and wrecks everything. Also according to the tutorial images should stay centered inside the boxes (the 3 images).
772
The OTHER answer is the best one, simply adding class="img-responsive" to the img tag does the trick! better from width:100%; is max-width:100%; and better all them is class img-responsive in BS3 or img-fluid in BS4. – Nabi K.A.Z.
img-responsive class: Responsive images in Bootstrap are created by adding . img-responsive class to img tag. An img-responsive class applies: max-width: 100% | height:auto | display:block onto the image.
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.
In bootstrap 3 Images are no longer responsive by default. Use .img-responsive for fluid size.
Doc:http://getbootstrap.com/getting-started/#migration-dropped
73
Have you tried adding class="img-responsive" to the problematic images?
38
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
