html - CSS：如何在调整屏幕大小时放大 div 的子 div 并将两个图像设置为顶部和底部固定

Question

我正在使用引导程序，我有一些像这样的 html：

<div class="col-sm-12 mainContainer">
    <div class="col-sm-4 imagesContainer">
        <div class="col-sm-12 firstImage">
            <img src="myimage1.jpg">
        </div>
        <div class="col-sm-12 secondImage">
            <img src="myimage2.jpg">
        </div>
    </div>
    <div class="col-sm-8 textContainer">
        <p>here we have some text</p>
    </div>
</div>

我想要的是设置与“textContainer”相同高度的“imagesContainer”，将第一个图像放在“imagesContainer”的顶部，将第二个图像放在“imagesContainer”的底部。因此，当调整大小、拉伸甚至放置大量文本时，我总是会在顶部有一个图像，在底部有一个图像，并且在这两者之间有很多空白。

谢谢您的帮助

Answer 1

请对以下内容使用相同的引导类：

    <div class="col-sm-4 imagesContainer">
    <div class="col-sm-8 textContainer">

修改后会是这样的：

    <div class="col-sm-8 imagesContainer">
    <div class="col-sm-8 textContainer">

最终解决方案将是：

<div class="col-sm-12 mainContainer">
  <div class="col-sm-8 imagesContainer">
    <div class="col-sm-12 firstImage">
      <img src="myimage1.jpg">
    </div>
    <div class="col-sm-12 secondImage">
      <img src="myimage2.jpg">
    </div>
  </div>
  <div class="col-sm-8 textContainer">
    <p>here we have some text</p>
  </div>
</div>