Card images in card deck render with incorrect aspect ratio on IE11 when image type is JPG
Created by: reykjavikingur
On Windows 10 using IE 11:
https://getbootstrap.com/docs/4.3/components/card/#card-decks
The HTML snippet for card decks shows <img class="card-img-top">
being used for the card images in a card deck structure. However, the example actually shown uses <svg class="card-img-top">
, which behaves differently on IE 11.
With an svg
element in that place, as the width scales down, the aspect ratio is preserved but the image contents are cropped appropriately. With an img
element, however, on most browsers, the aspect ratio is preserved, but on IE 11, it is not preserved.
The specific problems I would call out are:
- Your HTML snippet is inconsistent with your rendered example of Card Decks in your documentation.
- Your HTML snippet for card deck does not work appropriately on IE 11 when the image source is JPG.