I have a div, where I'm saving content using canvas
<div class="container-capa">
<img src=~/Content/imagemcartaovisita/@Session["NomeCapaCartao"] class="img-responsive" id="capa" alt="" width="589" height="324">
<label id="caminhosite">@Session["CaminhoSiteUsuario"]</label>
</div>
In the Js function I'm passing the same image size,
$(function () {
$("#btnSaveCartaoCapa").click(function () {
html2canvas($(".container-capa"), {
onrendered: function (canvas) {
theCanvas = canvas;
// document.body.appendChild(canvas);
// Convert and download as image
Canvas2Image.saveAsPNG(canvas, 589, 324);
//$(".main-footer").append(canvas);
// Clean up
//document.body.removeChild(canvas);
}
});
});
});
And in css:
.container-capa{
left: 0px;
top: 0px;
padding-bottom: 0%;
padding-top: 0px;
}
The problem is that when saving the file the image does not come in the correct size, comes a blank, the image comes with w280 and h300: Red would be the image and the green space