Two images side by side and responsive

Question

I\'m trying to put two images side by side and make them responsive. The problem now is, that the second image wraps first and then reacts to the size of the browser. I want

Answer 1

if image are same size or same ratio, you may use flex , width and min-width to set a break point:

#outer {
  width:70%;/* demo*/
  margin:auto;/* demo*/
  display:flex;
  flex-wrap:wrap;
}
#outer>div {flex:1;}
#outer>div>img {
  width:100%;
  min-width:200px;/* demo*/
}

remove or reset to your needs the rules commented with demo.