Ответ 1
Решение заключалось в том, чтобы добавить типичное исправление IE: (
CSS
height:auto !important;
У меня есть изображения с высотой = auto, потому что иногда они разные высоты, тогда как они всегда одинаковой ширины. Он работает в каждом браузере, но И.Е., есть ли что-то подобное, которое я могу использовать?
Решение заключалось в том, чтобы добавить типичное исправление IE: (
CSS
height:auto !important;
Я обнаружил, что добавление min-height:1px
решает проблему. Не уверен, почему, но, работал на меня.
Просто оставьте
height=auto
вне. Если он по умолчанию не присвоен "авто"...
Я пробовал все размещенные решения, и единственное, что работает, это
height=100%
Используйте высоту: автоматически вместе с шириной: авто и она будет работать в IE. Если вы укажете только один из них, IE будет расстроен.
height: auto;
width: auto;
Вы можете сделать width="100%"
и max-width="100px"
или любую необходимую ширину, а затем просто height="auto"
. Это сработало для меня.
Кстати, вам может понадобиться min-width
ширины min-width
если ваш родительский элемент не имеет ширины, которую вы хотите для своего изображения.
Также существует проблема с IE при использовании изображений с height=auto
в контейнерах flex.
Для меня лично проблема была вызвана тем, что изображение помещено в вложенные контейнеры flex. Мне удалось удалить родительский контейнер flex, и проблема была решена для меня.
Есть еще несколько решений, которые люди упомянули на странице ниже: https://github.com/philipwalton/flexbugs/issues/75
Для браузера Edge вы можете использовать max-height, который также будет работать для других браузеров
max-height: 100%;
У меня была та же проблема, и исправления с минимальной высотой и! Важным не помогли мне. Мой img был в гибком контейнере. Затем я попытался поместить img внутрь другого, оборачивая div и затем height: auto работал.
В "представлении совместимости IE9 - режим стандартного документа IE7", оставляя высоту = авто, может не решить проблему. Попробуйте добавить условный CSS и в ваш специальный файл css для IE ( "ie.css" ) добавьте строку, которая назначает соответствующую минимальную высоту вашему затронутому классу/элементу.
например:
.IE7. [css element] {min-height: xxxpx;}
Где xxx равно необходимой высоте изображения.
высота: начальная; будет работать вместо использования height: auto; в хром и т.д.