如何在内容区域制作具有最大高度和滚动条的“缩小以适合容器”？

问题描述

| 我正在尝试实现类似于带有标题和可滚动内容区域的常规Windows窗口。

.frame

缩小以适应其可变大小的内容，并且仅受

max-width

/

max-height

的限制：

<div class=\"frame\">
    <div class=\"title\">title</div>
    <div class=\"content scrollable\">content of variable width/height</div>
</div>

因此，基本上没有设置外部

width

/

height

，,0ѭ

width

/

height

仅受

max-width

，

max-height

的限制，除了limited0ѭ会缩小以适合其内容。 结果看起来就像是带有标题栏和变量variable4ѭ/

height

内容的常规Windows窗口，如果框架的

height

/

width

超过某些最大值，则应滚动该窗口。 如何在CSS中完成？     

解决方法

        

div.frame
{
max-width: 400px;
max-height: 200px;
overflow: auto;
}

小提琴