自定义布局 div、固定 div 但浏览器的响应大小、响应式文本

Question

注意：我正在使用各种链接 css n js，所以对我来说有点复杂..

最终用户请求是：

1. 带有保存 ajax 进度的选项卡菜单，其中之一是“容器 div”
2. 容器 div 的结果有边框
3. 容器 div 内有四种类型的框，
4. 输入 a:33% form width,b:67%,c:100%,d:67%+2row 全部固定。 （1 行可以填充 3 种类型的 a，或者只键入 b 并键入 a，或种类..）
5. 每个div的容器是各种文本，有标题，元描述，描述，按钮。（容器不能通过div，只有cat词不是字符，如果容器很小，容器必须跟随它的div）
6. 在所有 div 的末尾，底部有一个按钮。

进展：

1. 完成
2. 完成
3. 完成
4. 完成
5. 卡住
6. 完成

样品，但只是样品，只是为了想象..

1. Pick html 5 and look the list of news or kind of that

2. 3 box with almost like my want but

文本可能会破坏行，如果文本不合适，我希望将文本剪切成文字，并且我不会调整文本大小。但它总是会因 div 的布局而崩溃。

感谢您的帮助..

Answer 1

给你：https://jsfiddle.net/g96c1g3L/4/

function resizeRowHeight() {
    var maxHeight = 0;
    $('div[class^="col-sm-"]').each(function() {
        if ($(this).height() > maxHeight) {
            maxHeight = $(this).height();
        }
    });
    $('div[class^="col-sm-"]').each(function() {
        $(this).css('min-height', maxHeight + 'px');
    });
}

更新小提琴

https://jsfiddle.net/g96c1g3L/5/