css – 使用父div大小来引导响应网格系统

我需要使用bootstrap 12列网格来获得基于父div大小的响应形式.

作为一个例子,无论屏幕的大小如何,内容都需要看到div A的宽度,并将bootstrap的响应式设计基于该宽度.

我的目标是将响应式设计建立在模态窗口的大小上(在dhtmlx中).如果用户调整模态窗口的大小,该行应遵循规则(例如col-xs-12,col-sm-6等,但基于模态窗口的大小,而不是屏幕).

This fiddle show a modal window with some bootstrap form inside.我需要表单来响应模态表单的大小,而不是屏幕大小.

class="col-xs-12 col-sm-6"

解决方法

正如@makshh在评论中提到的那样,现在似乎无法做到这一点.我找到的唯一方法是@tsdexter的 another stack overflow question：

$(document).ready(function(){
  $('.somecontainer').on('resize',function(){
    if ($('.somecontainer').width() < 640) {
        $('.somecontainer').addClass('m');
    } else {
        $('.somecontainer').removeClass('m');
  });
});