Предотвратить растяжение CSS изгиб на обе оси

Question

Есть ли способ предотвратить растяжение по обеим осям CSS Flex? В приведенном ниже примере я хочу, чтобы слои option и box корректировались по ширине и высоте дочерних элементов. Кроме того, я хочу, чтобы поле находилось посередине страницы.

Я знаю о flex-grow и base, но, насколько я понимаю, он управляет только пространством главной оси.

.container {
  background-color: red;
  display: flex;
  justify-content: center;
}

.box {
  display: flex;
  flex-basis: 0;
  background-color: green;
  justify-content: center;
}

.option {
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: yellow;
}

.img-container {
  background-color: blue;
}

.img-container img {
  max-width: 100%;
}

<div class="container">
    <div class="box">
        <label class="option">
            Option 1
            <div class="img-container">
                <img src="https://hips.hearstapps.com/hmg-prod.s3.amazonaws.com/images/dog-puppy-on-garden-royalty-free-image-1586966191.jpg?crop=0.752xw:1.00xh;0.175xw,0&resize=640:*" />
            </div>
        </label>
        <label class="option">
            Option 2
            <div class="img-container">
                <img src="https://hips.hearstapps.com/hmg-prod.s3.amazonaws.com/images/dog-puppy-on-garden-royalty-free-image-1586966191.jpg?crop=0.752xw:1.00xh;0.175xw,0&resize=640:*" />
            </div>
        </label>
    </div>
</div>