Fabric JS - Issue in Scrollable Div

Fabric JS - Issue in Scrollable Div

HTML

<script src="https://rawgit.com/kangax/fabric.js/master/dist/fabric.js"></script>
<div class="imp-modal modal" role="dialog" id="sidemenu378">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<div class="row">
					<div class="col-md-12">
						Header
					</div>
				</div>
			</div>
            <div class="modal-body">
				<div class="row">
					<div>
                        <div>Canvas A</div>
                        <div>
                        <canvas id="a" width="400" height="400"></canvas></div>
                        <div>Canvas B</div>
                        <div>
                            <canvas id="b" width="400" height="400"></canvas>
                        </div>
					</div>
				</div>
			</div>
            <div class="modal-footer">
				<div class="row">
					<div class="col-md-12">
						Footer
					</div>
				</div>
			</div>
		</div>
	</div>
</div>


<canvas id="c" width="400" height="400"></canvas>

CSS

canvas {
    border: 1px solid #999;
}

.imp-modal {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index:1002;
  display:block;
    background-color: #FFF;
}

.imp-modal .modal-header {
  position: absolute;
  top: 0;
  height: 50px;
  width: 100%;
    background-color: #f0f0f0;
}
.imp-modal .modal-body {
  position: absolute;
  top: 50px;
  bottom: 50px;
  width: 100%;
  overflow-y: auto;
        -webkit-overflow-scrolling: touch;
}
.imp-modal .modal-footer {
  position: absolute;
  bottom: 0;
  height: 50px;
  width: 100%;
    background-color: #f0f0f0;
}
.imp-modal .modal-content,
.imp-modal .modal-dialog {
  height: 100%;
  width: 70%;
}
.imp-modal .close {
  opacity: 1;
}

JavaScript

/**
 * fabric.js template for bug reports
 *
 * Please update the name of the jsfiddle (see Fiddle Options).
 * This templates uses latest dev verison of fabric.js (https://rawgithub.com/kangax/fabric.js/master/dist/all.js).
 */

// initialize fabric canvas and assign to global windows object for debug
var canvas = window._canvas = new fabric.Canvas('a', {
			backgroundColor: '#FFF',
			selection: false,
			isDrawingMode: true
		});
		
		canvas.canvas_h = 400;
		canvas.canvas_w = 350;
		canvas.freeDrawingBrush.width = 2;
		canvas.freeDrawingBrush.color = '#005E7A';
		canvas.setHeight(canvas.canvas_h).setWidth(canvas.canvas_w);

// Do some initializing stuff
fabric.Object.prototype.set({
    transparentCorners: false,
    cornerColor: 'rgba(102,153,255,0.5)',
    cornerSize: 12,
    padding: 5
});

// ADD YOUR CODE HERE
// clear canvas
canvas.clear();

// add red rectangle
canvas.add(new fabric.Rect({
  width: 40,
  height: 20,
  left: 60,
  top: 5,
  fill: 'rgb(255,0,0)'
}));

// add green, half-transparent circle
canvas.add(new fabric.Circle({
  radius: 30,
  left: 60,
  top: 5,
  fill: 'rgb(0,255,0)',
  opacity: 0.5
}));

var text = new fabric.Text('Canvas A', {
top:10,
left:80,
fontSize:20,
backgroundColor: '#ffffcc',
borderColor:'#000',
opacity: 0.4,
fontFamily:"helvetica"}).setOpacity(0.4);
   	
canvas.add(text);   


text = new fabric.Text('First free draw with out scrolling... \n\rThen scroll a little and draw again. \n\rYou will notice that the drawing is off by the scroll amount', {
top:50,
left:10,
    width: 300,
fontSize:12,
backgroundColor: '#B3F0FF',
borderColor:'#000',
fontFamily:"helvetica"});
   	
canvas.add(text); 


// initialize fabric canvas and assign to global windows object for debug
var canvasB = window._canvas = new fabric.Canvas('b', {
			backgroundColor: '#FFF',
			selection: false,
			isDrawingMode: true
		});
		
		canvasB.canvas_h = 2000;
		canvasB.canvas_w = 350;
		canvasB.freeDrawingBrush.width = 2;
		canvasB.freeDrawingBrush.color...