是否可以根据高度在Flex容器中居中时的高度来保持图像的纵横比，如下所示：

<div class="fillerRow" style="flex: 80%">
    <div class="fillerBox"></div>
    <img id="centerImg" src="./img/image.png"></img>
    <div class="fillerBox"></div>
</div>

.fillerRow {
    display: flex;
    flex-direction: row;
    width: 100%;
    flex: 1;
}

.fillerBox {
    flex: 1;
}

#centerIImg {
    height: 100%;
    flex: auto;
    width: auto;
}

这里的想法是图像基于屏幕高度缩放，同时保持其纵横比 . 围绕图像的两个填充框div应该调整它们自己的宽度，同时尊重中心的图像 .

这怎么可能？

html css flexbox