html - pdf オブジェクトのサイズを親の div サイズに変更する

Question

Web ページに .pdf および .png ファイルをレンダリングします。

<table class="table">
  ...
    <tr ng-if=collapseimg >
      <td colspan="100%">
        <div ng-if="report._source.attachment && report._source.attachment.charAt(0) === 'i'">
          <object data="data:image/png;base64,{{ report._source.attachment }}"></object>
        </div>
        <div ng-if="report._source.attachment && report._source.attachment.charAt(0) !== 'i'">
          <object data="data:application/pdf;base64,{{ report._source.attachment }}"></object>
        </div>
      </td>
    </tr>
  </tbody>
</table>

はbase64report._source.attachmentでエンコードされた文字列です。たとえば、pdf 文字列が開始JVBERi0x...し、png 文字列が - になりiVBORw0KGgo...ます。

私のスタイル（以下）のルール：

  object {
    max-width: 100%;
    max-height: 100%;
    display: inline-block;
  }

  embed {
    max-width: 100%;
    max-height: 100%;
    display: inline-block;
  }

画像 (png) のサイズが正しく変更されました。しかし、上記のスタイルは pdf には何の効果もありません。

親divのサイズに合わせてpdfのサイズを変更する方法は?

これは plunker でのシミュレーションです。私が必要としているのは、ハードコーディングされていない同じサイズの pdf と pngwidthとheight.