Not respecting parent size

I’ve noticed a few issues / posts about this already, but I can’t seem to find a simple solution.

Why, in the following example doesn’t Chart.js respect the width and height of its parent div? http://codepen.io/woutr_be/pen/EKdqrE

This is rather annoying as my charts need to be flexible and I can’t always maintain a fixed width and height.

I can force the canvas to maintain it by using CSS, but this will resize the canvas without redrawing it.

Author: Fantashit

6 thoughts on “Not respecting parent size

  1. @zachpanz88 I don’t quite understand, .chart-holder is set to width: 800px; height: 200px, the div directly inside it has max-width: 100%%; max-height: 100%%. The chart however is 800px by 400px.

    screen shot 2016-05-01 at 9 38 36 am

    I’ve created a non-angular example that has te same problem: http://codepen.io/woutr_be/pen/BKGovq
    Parent div is set to a fixed width and height, the chart however is bigger.

Comments are closed.