Title: Width
Last modified: August 2, 2017

---

# Width

 *  Resolved [vandsimy](https://wordpress.org/support/users/vandsimy/)
 * (@vandsimy)
 * [8 years, 10 months ago](https://wordpress.org/support/topic/width-21/)
 * Hello, i love everything about this plugin, its really easy to use and to create
   the charts i’ve been wanting to – place them wherever i’d like.
 * The only problem that i have is that in certain pages even though the width is
   supposed to be responsive, on FIRST load it seems to be stuck in a container 
   which is 600px. After first load, if i resize the browser the width seems to 
   become correct.
 * I tried to work around it with css but wasn’t able to.
 * If you could help me resolve this issue i would be grateful
 * Thanks a lot for this awesome plugin!

Viewing 6 replies - 1 through 6 (of 6 total)

 *  Plugin Author [methnen](https://wordpress.org/support/users/methnen/)
 * (@methnen)
 * [8 years, 9 months ago](https://wordpress.org/support/topic/width-21/#post-9402653)
 * Hey vandsimy I’m glad you like the plugin.
 * I’d need to see the specific case where this is happening to figure out what 
   might be happening.
 * There’s nothing in particular in the code that should ever be limiting the width
   to 600px when a chart is embedded in a post and I’ve actually never seen this
   issue crop up before.
 *  Thread Starter [vandsimy](https://wordpress.org/support/users/vandsimy/)
 * (@vandsimy)
 * [8 years, 9 months ago](https://wordpress.org/support/topic/width-21/#post-9446996)
 * Hello methnen!
 * I’m really sorry for the late reply.
 * Here’s a link to the page where i had this problem.
 * [http://bit.ly/2wCH9TY](http://bit.ly/2wCH9TY)
 * Thank you very much!
 *  Plugin Author [methnen](https://wordpress.org/support/users/methnen/)
 * (@methnen)
 * [8 years, 8 months ago](https://wordpress.org/support/topic/width-21/#post-9533454)
 * Hey,
 * Sorry again for the delay. Life has been busy. Looking at that page I’m pretty
   sure the div that the chart is inside of is not a full width div which is why
   you aren’t getting a full width chart.
 * You’ll notice if you make the browser window small enough the chart is acting
   responsively.
 *  Thread Starter [vandsimy](https://wordpress.org/support/users/vandsimy/)
 * (@vandsimy)
 * [8 years, 8 months ago](https://wordpress.org/support/topic/width-21/#post-9534493)
 * Hello!
 * Thanks for checking it out and its not a full width, its a 3/4 width
    I’ve added
   the same chart under it which is full width and it does the same thing.
 * I’m using wpbakery visual composer if this helps to understand the problem better
 * On first load it just looks like its stuck in a certain width, but when i resize
   the browser window, it takes the correct dimensions.
 * Thanks again!
 *  Plugin Author [methnen](https://wordpress.org/support/users/methnen/)
 * (@methnen)
 * [8 years, 8 months ago](https://wordpress.org/support/topic/width-21/#post-9535769)
 * OK, this is a weird one and I can’t duplicate it outside of your specific theme.
 * After looking at it for a bit I think what’s happening is that theme isn’t finished
   rendering until AFTER the Highcharts code has started rendering the charts. That
   means Highcharts is doing it’s thing before it knows the width of the containing
   div.
 * This isn’t the prettiest solution but probably the simplest fix would be to run
   the Highcharts reflow function on any charts in the page after small timeout (
   whatever is enough to give the them time to finish rendering).
 * Something along these lines SHOULD work:
 *     ```
       var m_chart_refresh = {};
   
       (function( $ ) {
       	'use strict';
   
       	m_chart_refresh.init = function() {
       		setTimeout(function() {
       			m_chart_refresh.reflow_charts();
       		}, 500 );
       	};
   
       	m_chart_refresh.reflow_charts = function() {
       		$( '.m-chart' ).each(function() {
       			$(this).highcharts().reflow();
       		});
       	};
   
       	$( function() {
       		m_chart_refresh.init();
       	} );
       })( jQuery );
       ```
   
 * Obviously you’d want to adjust the timeout to be as small as possible while still
   reliably kicking in AFTER the theme has finished rendering.
 *  Thread Starter [vandsimy](https://wordpress.org/support/users/vandsimy/)
 * (@vandsimy)
 * [8 years, 8 months ago](https://wordpress.org/support/topic/width-21/#post-9541842)
 * Hello methnen,
 * Wow thats actually incredible! It worked!
 * Thank you a lot!
 * It works fine now!

Viewing 6 replies - 1 through 6 (of 6 total)

The topic ‘Width’ is closed to new replies.

 * ![](https://ps.w.org/m-chart/assets/icon-256x256.png?rev=3472197)
 * [M Chart](https://wordpress.org/plugins/m-chart/)
 * [Support Threads](https://wordpress.org/support/plugin/m-chart/)
 * [Active Topics](https://wordpress.org/support/plugin/m-chart/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/m-chart/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/m-chart/reviews/)

 * 6 replies
 * 2 participants
 * Last reply from: [vandsimy](https://wordpress.org/support/users/vandsimy/)
 * Last activity: [8 years, 8 months ago](https://wordpress.org/support/topic/width-21/#post-9541842)
 * Status: resolved