Dear admins,
Here is in full detail what problem I am facing and what I want:
I loop through a number. By looping I create boxes and in those boxes are the charts. Now do I have a grid with the css property of:
grid-template-columns: repeat(2, auto);
This will create 2 boxes next to eachother till the loop is finished. Since the boxes arent square by resizing I made something in Javascript so by resizing the boxes still get equal width and height (also on onload). If I have for example in chrome Mobile S selected, I should get 2 boxes with equal width and height (153 by 153px). Now when I implement the gauge for example, the gauge will override the width and height of the box where it is in. Because of this I will mostly of the time only see 1 box(the one with the gauge) or it looks horrible. By commenting out the gauge and just showing the other charts(scatterbar and bar), they wont affect the box. But, they instead get very small of dont display anything.
What I want:
1. To make the gauge appear normal and won't override the w&h of the box.
2. To display the others charts properly even on mobile S version.
I have mad a Dojo example where I've tried my best to show what's wrong
https://dojo.telerik.com/UMiBuKoS
Hopefully you can give me some information to solve this.
Kind regards.