Вопрос выравнивания легенды JQPlot

Folks,

У нас возникают трудности с выравниванием легенд групповой гистограммы.

В принципе, мы хотим выровнять легенды горизонтально в одном сыром, но легенды идут по разной линии

также легенды перекрываются с осью, мы попробовали marginTop, marginLeft, но это не имеет никакого эффекта.

Код

<!--[if lt IE 9]><script language="javascript" type="text/javascript" src="excanvas.js"></script><![endif]-->
<script language="javascript" type="text/javascript" src="jquery.min.js"></script>
<script language="javascript" type="text/javascript" src="jquery.jqplot.min.js"></script>
<script type="text/javascript" src="plugins/jqplot.barRenderer.min.js"></script>
<script type="text/javascript" src="plugins/jqplot.pieRenderer.min.js"></script>
<script type="text/javascript" src="plugins/jqplot.categoryAxisRenderer.min.js"></script>
<script type="text/javascript" src="plugins/jqplot.pointLabels.min.js"></script>
<link rel="stylesheet" type="text/css" href="jquery.jqplot.css" />

<div id="chart2" style="height:400px;width:300px; "></div>

<script>

$(document).ready(function(){
var s1 = [2, 6, 7, 10];
var s2 = [7, 5, 3, 2];
var s3 = [7, 5, 3, 3];
var ticks = ['a', 'b', 'c', 'd'];
plot2 = $.jqplot('chart2', [s1, s2, s3], {
seriesDefaults: {
renderer:$.jqplot.BarRenderer,
pointLabels: { show: true,stackValue:true }
},
axes: {
xaxis: {
renderer: $.jqplot.CategoryAxisRenderer,
ticks: ticks
}
},
legend: {
renderer: jQuery.jqplot.EnhancedLegendRenderer,
show: true, 
location: 's',
placement: 'outside',
rendererOptions: {
numberRows: '1',
numberColumns: '3'
}
}

});
});