Question

我刚刚在Firefox中遇到一个奇怪的错误。我有一个图像显示为flex-item，并希望它使用max-width和height：auto缩小到最大尺寸。它在我测试的所有浏览器中都能完美运行，除了Firefox。我想这与flex-items的默认对齐有关，这是flex。我把它覆盖到flex-start，这很好，但不适用于Firefox。

还有其他人经历过这个吗？

img {
    max-width: 50px;
    height: auto;
}

.container {
    display: flex;
    align-items: flex-start;
}

请参阅此Codepen以获取示例：http://codepen.io/kaesetoast/pen/PPevbv

Answer 1

使用flex-basis

的max-width插件

img {
    flex-basis: 50px;
    height: auto;
    }

＆＃13;

img {
  flex-basis: 50px;
  height: auto;
}
.container {
  display: flex;
  align-items: flex-start;
}

＆＃13;

<div class="container">
  <img src="http://lorempixel.com/1440/1500/" width="1440" height="1500" alt="">
</div>

＆＃13;

在FF 41.0.2中测试

在Firefox

1 个答案: