Test html2canvas with media queries
HTML
<script src="http://rawgit.com/niklasvh/html2canvas/master/dist/html2canvas.js"></script>
<p><button id="html2canvas">Export</button></p>
<div id="container">
<div class="element"></div>
<div class="element"></div>
<div class="element"></div>
</div>
<p>Result:</p>
<div id="result"><div>
CSS
.element {
display: inline-block;
height: 30px;
width: 30px;
margin-right: 10px;
background-color: green;
}
@media only screen and (max-width: 300px) {
.element {
background-color: red !important;
}
}
JavaScript
$('#html2canvas').click(function() {
html2canvas($('#container')).then(function(canvas){
$('#result').html(canvas);
});
});