JSFiddle - React, Tailwind, and code Playground
by Slezi
HTML
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-2.2.0.min.js"></script>
<div class="row">
canvas
<canvas id="canvas">
<div class="testDiv">
</div>
</canvas>
</div>
<div class="col-xs-2 col-sm-2" id="border">content right</div>
<script>
$("#canvas").outerHeight($(window).height()-$("#canvas").offset().top- Math.abs($("#canvas").outerHeight(true) - $("#canvas").outerHeight()));
$(window).on("resize", function(){ $("#canvas").outerHeight($(window).height()-$("#canvas").offset().top- Math.abs($("#canvas").outerHeight(true) - $("#canvas").outerHeight()));
});
</script>
</div>
CSS
#border{
border: solid 1px black;
}
#canvas{
border: solid 1px blue;
width: 100%;
}
.testDiv {
height: 100px;
width: 100px;
background-color: red;
}