How to make elements not change structure when the screen is reduced?

Question

css

Good afternoon. There is a block in which there are 2 pictures in a row. Each image has a property max-width:100%and float:left(or display:inline-block)
How can I make the images shrink in width and height, respectively, when the browser size is reduced, without changing the structure? Now, when decreasing, the extreme picture moves down to the 2nd line. Thank you.

Answer 1

make images 50% wide

Answer 2

For the picture

display: block;
height: auto;
max-width: 100%;

And the pictures are generally desirable in separate blocks of 50% in width. like in bootstrap