Use parent div size for bootstrap responsive mesh

Question

I need to use a 12 column bootstrap grid to get a responsive shape based on the size of the parent div.

As an example, regardless of screen size, the content should see the width of div A and base the bootstrap responsive design on that width.

My goal is to base my responsive design on the size of the modal window (in dhtmlx). If the user resizes the modal window, the line must follow the rules (for example, col-xs-12, col-sm-6, etc., But it depends on the size of the modal window, and not on the screen).

This fiddle shows a modal window with some form of bootstrapping. I need a form that will respond to the size of the modal form, not the screen size.

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

Answer 1

As @makshh mentioned in the comment, it seems like this is now impossible to do. The only way I found is from another question from @tsdexter:

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