这是我在这里的第一个帖子，如果我不明白一些规则，对不起。

我有一个非常棘手的问题。我学习了flexbox，用Firefox检查了我的代码，并且工作正常，但是当我使用chrome或safari时，IMG不能使用响应，也不能正确地伸缩。

我在此处上载了代码：https://codepen.io/joaquingalloux/pen/xwryxem

请登录Firefox和Chrome，我在网上找遍了，但没有答案。

非常感谢您抽出时间。

顺晟科技：

可以通过更改为instead of来消除差异。

inline-flex的宽度计算要复杂得多，因为flex元素试图增长以填充可用空间，但块总是试图使用最小的可用空间。 看起来不同的浏览器选择以不同的方式解决这个问题。

通过将flex-container更改为块，宽度计算更加稳定，因为块和flex都试图占用可用空间

解决了。我忘记为IMG

* {
  margin: 0;
  padding: 0
}

.container-imagenes {
  margin: 0;
  padding: 0;
  /* border: 20px solid white; */
  display: inline-flex;
  background: #DB277F;
  align-items: center;
  max-width: 1200px;
  font-size: 20px;
  flex-wrap: nowrap;
  flex-direction: row;
  justify-content: stretch;
  display: -moz-box;
  display: -ms-inline-flexbox;
  display: -webkit-inline-flex;
  display: inline-flex;
}

.textbox {
  flex-basis: 500px;
  flex-grow: 1;
  background: #DB277F;
  text-align: center;
  font-family: 'Raleway', sans-serif;
  font-weight: 700;
  font-size: 50px;
}

.text1 {
  font-size: 20px;
  font-family: 'Raleway', sans-serif;
  font-weight: 700;
}

.text2 {
  font-size: 40px;
  font-family: 'Raleway', sans-serif;
  font-weight: 700;
}

.text3 {
  font-size: 20px;
  font-family: 'Raleway', sans-serif;
  font-weight: 700;
}

#mailregs2 {
  border: 2px solid rgb(255, 255, 255);
  background-color: #008BAC;
  color: #ffff;
  ;
  padding: 10px 20px;
  font-size: 20px;
  font-family: 'Raleway', sans-serif;
  font-weight: 800;
  cursor: pointer;
  text-transform: uppercase;
}

.imagen-1 {
  width: 100%;
  flex-grow: 4;
  flex-basis: 300px;
}

.imagen-2 {
  width: 100%;
  flex-grow: 4;
  flex-basis: 300px;
}

在https://codepen.io/joaquingalloux/pen/xwryxem

谢谢