【electron】table要素に対してmax-height: ○%を指定しても反映されない

前提・実現したいこと

こちらのページを参考に、Electronにてスクロール可能な表を作成しています。
ただし、ウィンドウサイズを可変にする、ほかの要素の表示/非表示をアプリの状態で切り替えたい、といった条件から、max-heightを%で指定したいです。

発生している問題・エラーメッセージ

画像のように、%でのmax-heightの指定が機能せず、ほかの要素まで含めたスクロールになります。

該当のソースコード

vue
1<template>
2    <div class="vertical-scroll-table">
3        <table>
4            <thead>
5            <tr><th>果物</th><th>野菜</th><th>価格</th></tr>
6            </thead>
7            <tbody>
8            <tr><td>リンゴ</td><td>トマト</td><td>100</td></tr>
9            <tr><td>みかん</td><td>キュウリ</td><td>200</td></tr>
10            <tr><td>もも</td><td>キャベツ</td><td>300</td></tr>
11            <tr><td>スイカ</td><td>人参</td><td>400</td></tr>
12            <tr><td>オレンジ</td><td>大根</td><td>500</td></tr>
13            <tr><td>ぶどう</td><td>レタス</td><td>600</td></tr>
14            <tr><td>リンゴ</td><td>トマト</td><td>100</td></tr>
15            <tr><td>みかん</td><td>キュウリ</td><td>200</td></tr>
16            <tr><td>もも</td><td>キャベツ</td><td>300</td></tr>
17            <tr><td>スイカ</td><td>人参</td><td>400</td></tr>
18            <tr><td>オレンジ</td><td>大根</td><td>500</td></tr>
19            <tr><td>ぶどう</td><td>レタス</td><td>600</td></tr>
20            <tr><td>リンゴ</td><td>トマト</td><td>100</td></tr>
21            <tr><td>みかん</td><td>キュウリ</td><td>200</td></tr>
22            <tr><td>もも</td><td>キャベツ</td><td>300</td></tr>
23            <tr><td>スイカ</td><td>人参</td><td>400</td></tr>
24            <tr><td>オレンジ</td><td>大根</td><td>500</td></tr>
25            <tr><td>ぶどう</td><td>レタス</td><td>600</td></tr>
26            </tbody>
27        </table>
28    </div>
29</template>
30
31<script lang="ts">
32 (省略)
33</script>
34
35<style>
36.vertical-scroll-table{
37	color: #5e5e5e;
38        max-height: 30%;
39	overflow: auto;
40	overflow-x: hidden;
41}
42</style>

試したこと

px、vhでmax-heightを指定した場合に機能することは確認しています。
また、chrome、edgeでは%指定が機能することを確認しています。

Electron Fiddle(electron v11.4.3)では機能しませんでした。
また、bodyのmax-heightを指定しても機能しませんでした。

補足情報（FW/ツールのバージョンなど）

以下、package.jsonより。

  "dependencies": {
    "core-js": "^3.8.3",
    "electron-store": "^7.0.2",
    "register-service-worker": "^1.7.1",
    "vue": "^2.6.11",
    "vue-class-component": "^7.2.3",
    "vue-property-decorator": "^9.1.2",
  },
  "devDependencies": {
    "chromedriver": "88",
    "electron": "^11.0.0",
    "typescript": "~3.9.3",
  }