在右边的div中，我有一个图像和一个链接。可能加载的图像具有多种宽高比（从0.38到6.83），我无法控制源图像，但它们需要具有适当的宽高比。要做到这一点，我已经给它.owner-info-container但是图像通常比那个宽度更薄。
我试图让第一个div（.primary-image-container）占用第二个div（max-width）不使用的父级中的所有剩余空格。如果图片没有占据<div class="owner-address col-xs-12">
<div class="owner-info-container">
<h3>Address</h3><br/>
<span class="owner-info">
<span class="header">Owner Name</span><br/>
<span>Name goes here</span>
</span>
</div>
<div class="primary-image-container">
<img />
<a>Send us an updated photo</a>
</div>
</div>
允许的整个空间，我希望左边的容器不要将其留作空格。
我已经搞砸了第二个div，但是如果第一个div的内容太宽，它就不会闯入新的一行，它只会推动第二个div下来。
HTML
{{1}}
答案 0 :(得分：1)
您可以使用documentation完成此操作。
如果您将display: flex;分配给.owner-address课程，然后将.owner-info-container flex-grow: 1;分配给.owner-address，则会占用.owner-address {
display: flex;
}
.owner-info-container {
flex-grow: 1;
}
内的剩余空间
<强> CSS
Compile Sources<强> flexbox