2.1: distorted images in Chrome

[heldchen]

the image height bug previously fixed in 2.0.3 (issue #1899 and #2779) is back in 2.1.0

[ansman]

Confirmed, annoying as hell!

The culprit here seems to be 7b726f974f5e00c57b1087bb62d516943d9a58e3 and the awesome commit message doesn't give much insight to why it's needed.

[mdo]

This has to be done. Don't use the height attribute, but external or inline styles. I've clarified the comments for the responsive images, but for proper scaling everywhere, this is necessary.

[heldchen]

this should go into responsive css then and not the main one. we're not using a responsive layout at all and thus expect the images to be shown with the proper static sizes.

there's no way to undo these css changes by overriding in css unless you patch them out of bootstrap.css which makes them extremely annoying in our case.

[ansman]

@markdotto Couldn't we have some sort of class to show that we want this?

Usually I could just override the style but since I cannot undo this (height and width on img).

[ansman]

Also, this breaks another really important aspect.

I want to scale missing images and keep the original aspect ratio.

[HiroProt]

Took me many hours to figure out what was going on here when using isotope JS, as it relies on the browser image sizing to properly position elements. I think this CSS rule does more damage than good and should be removed.

[frolic]

👍

height: auto does some nasty stuff with broken images.

[aleemb]

I ran into the same issue. Even setting <img height=100 width=100 ... /> causes the height to be undetermined untilt he image loads and that causes the page to reflow in Google Chrome. IE8 and FF both work fine and reserve the image space.

The page reflow is kind of annoying especially if multiple images are waiting to load.

[iegik]

This bug also repeats in 3.0.0

[LionLai]

this bug find in 2.3.1 in FF / IE / Chrome

[cvrebert]

Related: #4471