rCharts highcharts legend and export button above chart

Question

All I am trying to do is to have my legend and export button above my chart area with fixed y axis. But this has proven difficult. It overlays over the chart area as seen below.

Here is my R code

library(rCharts)
df <- data.frame(month=rep(c('Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'),2),
           type=c(rep("Type1",12),rep("Type2",12)),
          value=c(0.6, 0.5, 0.2, 0.3, 0.8, 1, 0.6, 0.5, 0.4, 0.1, 0.6, 0.8,
                  0.2, 0.8, 0.7, 0.3, 0.4, 0.7, 0.8, 0.9, 1, 0.3, 0.2, 0.5))


p <- hPlot(x = "month", y = "value", data = df, type = c("line"), group = "type")
p$yAxis(title=list(enabled="null"),max=1)
p$exporting(enabled=T,
             buttons=list(
               contextButton = list(
                 align = 'right',
                 verticalAlign = 'top'
               )
             ))
p$legend(
  align = 'left',
  verticalAlign = 'top',
  layout = 'horizontal',
  floating = 'false')
p

The floating option for legend doesn't seem to do anything. I also tried changing x, y options for legend and exporting button but nothing.

Then I decided to check if this something wrong in the Highcharts javascripts library. But it turns out the same code in js works fine. Its messed up when produced in R.

Here is the javascript code and JsFiddle link here. Correct figure below.

$(function () {
    $('#container').highcharts({

        legend: {
            align: 'left',
            verticalAlign: 'top',
            layout: 'horizontal'
        },
           navigation: {
            buttonOptions: {
                align: 'right',
                verticalAlign: 'top'
            }
        },

        xAxis: {
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
        },
        title: {
            text: null
        },
         yAxis: {
            max: 1
        },
        series: [{
            name: 'Type 1',
            data: [0.6, 0.5, 0.2, 0.3, 0.8, 1, 0.6, 0.5, 0.4, 0.1, 0.6, 0.8]
        }, {
            name: 'Type 2',
            data: [0.2, 0.8, 0.7, 0.3, 0.4, 0.7, 0.8, 0.9, 1, 0.3, 0.2, 0.5]
        }],
    });
});

If anyone has any ideas on what I might be doing wrong or means to resolve this, please let me know. Thanks.