Why is it that the .cropper-container is always set to 200x100 px? I cannot style it so it scales properly. I can see the styles are set inline to the element itself (meaning it is set in JS?).
This is how small it looks when simply initialising the cropper without any settings. I have not added any css to interfere with anything.

MORE INFO:
To be clear, I have also tried minCanvasWidth and minCanvasHeight, which partly solves the problem. I now have a bigger image, but the cropper still can't size bigger than 200x100 px.. Meaning this is not the solution (this is the max side of the cropped area, I cant drag it any bigger)

Please read the docs about the minContainerWidth and minContainerHeight options:
$('img').cropper({
minContainerWidth: 800,
minContainerHeight: 600
})
In my situation the solution was to apply cropper on image load:
$('img').load(function() {
$('img').cropper();
});
Most helpful comment
Please read the docs about the
minContainerWidthandminContainerHeightoptions: