图像在flexbox中没有调整大小

Question

我有这个

.parentcontainer
{
background-color: black;
max-width: 100%;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: space-around;


}

.aside
{
display:flex;
flex: 30%;

flex-direction: column;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: stretch;



}
.content
{

background-color: blue;
flex: 70%;
display: flex;
flex-direction: column;
flex-wrap: wrap;
justify-content: space-between;
align-content: flex-start;
max-height:800px;


}

.content img
{
width: 100%;
max-width: 100%;
height: auto;
}

当我调整浏览器的大小时，.content的imgs没有调整大小，我需要进行水平滚动。如何调整图像大小？并且子容器不会比父容器大。感谢。

编辑：现在我将.content更改为列，将mas高度更改为800px。我希望.content的文章记录下来，当它们达到800px时，再创建一个列。问题仍然存在，.content的文章不在父框之外，或者调整大小......

Answer 1

试试这个：

.content img{
    width: 100%;
    max-width: 100%;
    height: auto
}