Horizontal movement of splitbar is not resizing contents

[Jmales]

So, I have a 4-split window and when I resize via dragging a vertical splitbar, the contents of each panel get resized.

However when I do it with an horizontal splitbar nothing resizes and I just get a scroll down bar, which is not what I want.

The code:

 <div ui-layout options="{flow : 'column'}">
    <div ui-layout-container size="80%" min-size="20%">
      <div ui-layout options="{flow: 'row'}">
         <div ui-layout-container id="visPanel" min-size="20%" size="70%">
            <div ng-controller="LineCtrl">
                **multiple canvas here which are not resized when horizontal splitbar is dragged**
           </div>
        </div>
        <div ui-layout-container id="timePanel" size="30%" min-size="5%">
            ... 
        </div>
   ....

Also, I'm trying to catch the clientWidth and clientHeight in onResize() but that only works when the whole window is resized and not each pane. What is happening?

I'm using v1.4.2.

[Jmales]

Solved it. Added my own function which is called by either MouseUpHandler() and OnResize().

For people with the same trouble:

        var parentHeight = document.getElementById("visPanel").clientHeight;
        var parentWidth = document.getElementById("visPanel").clientWidth;

        var canvases = document.getElementsByClassName("chart");
        var lengthArrayCanvas = canvases.length;
        for (var i = 0; i < lengthArrayCanvas; i++) {

            canvases[i].style.maxHeight = parentHeight / lengthArrayCanvas + 'px';
            canvases[i].style.maxWidth = parentWidth + 'px';
            canvases[i].style.height = canvases[i].style.maxHeight;
        }