Html 设置高度和滚动

我用的是基金会

<div class="row">
    <div class="small-8 columns image-container">
        <img src="/img/myimage.jpg">
    </div>
    <div class="small-8 columns text-container">
        <!-- Long Text Goes Here -->
    </div>
</div>

---

是否有一种方法（使用CSS）来设置模式的高度，使其永远不会超过图像的高度，然后如果长文本超过高度，则使其滚动？

CSS中的高度和溢出，您可以轻松控制图像高度

.image容器{
高度：300px/*您可以放置要设置的高度*/
溢出y：隐藏；
}
.图像容器img{
高度：自动；
最大高度：300px；
}

---

我想我已经得到了你需要的东西。请看这里：

我把整排都包在一张桌子上。作为表格的图像和文本包含在其中。文本的表格单元格具有内联块div，其中包含文本。您可以通过操纵.image类大小来测试它。然后，文本字段的高度将进行调整。代码如下：

HTML:

要测试自定义的各种图像大小，请更改图像的高度：

.image{
    height: 190px;
}

---

在两者上设置相同的高度属性，然后在文本容器上设置

overflow-y:scroll

。如果你事先不知道图像的大小，这将是困难的，只要CSS，你可能需要JavaScript来计算高度并设置在文本容器上，这是一个小提琴，如果你知道它的高度和宽度是它的基础，所以它是响应的，我不知道高度，请添加一个JSFIDLE/jsbin，其中有几个示例显示您的问题。我不是告诉您修复图像的高度，但您必须限制到某个高度。正如你所要求的。而且它的长宽比不会受到影响。顺便说一句，我想帮你，但你给了我五分，这不是票价。如果你不喜欢我的回答，只需评论并忽略它，但不要给出否定的观点

.container{
    display: table-row;
}

.img-div {
    display: table-cell;
    float: left;
}

.outer-text{
    display: table-cell;

    height: 100%;
    width: 190px;
}

.text-div{
    display: inline-block;

    height: 100%;

    overflow-y: auto;
}

.image{
    height: 190px;
}