NarrowMargins

HTML

<div id="container" style=" height:200px; width:250px;"></div>


<script type="text/javascript" src="https://raw.github.com/highslide-software/highcharts.com/master/js/highcharts.src.js"></script>

JavaScript

Highcharts.setOptions({
    chart: {
        style: {
            fontSize: '9px'
        }
    }
});

var chart = new Highcharts.Chart({
    credits: {
        enabled: false
    },
    chart: {
        renderTo: 'container',
        type: 'column',
        spacingTop: 0,
        spacingBottom: 0,
        spacingLeft: 0,
        spacingRight: 0,
width: 300,
        backgroundColor: 'yellow'
    },
    title: {
        text: 'My Title comes here',
        margin: 10,
        style: {
            fontSize: '14px'
        }
    },
    subtitle: {
        text: 'my subtitle',
        y: 25
    },
    legend: {
        
        symbolPadding: 3,
            //borderWidth:
        
itemStyle: { paddingBottom: '20' }

    },
    yAxis: {
        title: {
            //text:null
            margin: 5
        },
        labels: {
            x: -3,
            style: {
                fontSize: '9px'
           }
        }
    },
    xAxis: {
        categories: ['Jan 2011', 'Feb 2011', 'Mar 2011'],
        //     categories: ['Jan', 'Feb', 'Mar'],
        labels: {
            style: {
                fontSize: '9px',
                lineHeight: '11px'
            }
        }

    },
    plotOptions: {
        series: {
            stacking: 'normal',
            groupPadding: 0.05
        }
    },

    series: [
        {
        name: 'Product 1',
        data: [29.9, 71.5, 106.4]},
    {
        name: 'Product 2',
        data: [129.9, 171.5, 150]},
    {
        name: 'Product 3',

        data: [97, 34, 75]},
    {
        name: 'Product 4',

        data: [15, 98, 121]}


    ]
});