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

Question

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

最终用户请求是：

1. 带有几个ajax进度的Tab菜单，其中一个是＆＃34;容器div＆＃34;
2. 有容器div的结果的边界线
3. 容器div内有四种类型的盒子，
4. 键入a：33％表格宽度，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

文字可能会破坏行，我希望文字切入文字，如果它没有＆＃39;适合，我不会调整文本大小。但它总是与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/