Angular Scale PDF Viewer for surrounding elements

Question

I use the Angular PDF Viewer , and it is brilliant, and I like it, but I have a terrible time for it to scale correctly.

Here is a sample code (using Pure CSS , but the question is also relevant if I used Bootstrap scaffolding):

<div class="pure-g">
  <div class="pure-u-8-24">
    <pdf-viewer delegate-handle="loaded_doc_viewer" url="uploaded_doc_data_url" scale="1"></pdf-viewer>
  </div>
  ...
</div>

The problem is that the size of the pdf-viewer depends on the size of the pdf, and not on the containing grid element.

Is there a way to fit the canvas without doing something stupid and hacky, ideally using percent for width (ala width:100%) to keep it consistent with the grid? If not, is there a stupid and hacker way to do the same?