noData messsage not auto wrapping on window resize - highcharts

Question

When displaying a long noData message on High Chart, the text is not wrapping and is going out of screen/chart.
DEMO: http://jsfiddle.net/9xLyo7xj/
lang:{noData:'this is a really long sentence that is supposed to wrap around the window but somehow it is not - I would like it to wrap for easier reading'}
HTML
<button id="add">Add data</button>
<button id="remove">Remove data</button>
<button id="showCustom">Show custom message manually</button>
JS
$(function() {
var chart,
btnRemove = $('#remove'),
btnAdd = $('#add'),
btnShow = $('#showCustom');
btnAdd.click(function() {
chart.series[0].addPoint(Math.floor(Math.random() * 10 + 1)); // Return random integer between 1 and 10.
});
btnRemove.click(function() {
if (chart.series[0].points[0]) {
chart.series[0].points[0].remove();
}
});
btnShow.click(function() {
if (!chart.hasData()) {
chart.hideNoData();
chart.showNoData("Your custom error message");
}
});
$('#container').highcharts({
title: {
text: 'No data in line chart - with custom options'
},
series: [{
type: 'line',
name: 'Random data',
data: []
}],
lang: {
noData: "this is a really long sentence that is supposed to wrap around the window but somehow it is not - I would like it to wrap for easier reading"
},
noData: {
style: {
fontWeight: 'bold',
fontSize: '15px',
color: '#303030',
width: 400px
}
}
});
chart = $('#container').highcharts();
});