css - html table 2段 - 残りの画面スペースの高さを埋めるdivを作る

HTML table / html / html-table

Webアプリケーションで、コンテンツを画面全体の高さに合わせて表示したいと考えています。

#page {
    height: 100%; width: 100%
}

#tdcontent {
    height: 100%;
}

#content {
    overflow: auto; / *またはオーバーフロー:非表示; * /
}
<table id="page">
    <tr>
        <td id="tdheader">
            <div id="header">...</div>
        </td>
    </tr>
    <tr>
        <td id="tdcontent">
            <div id="content">...</div>
        </td>
    </tr>
</table>

danronmoon



Answer #1
body {
  padding: 0;
  margin: 0;
}

.full-height {
  width: 100px;
  height: 100vh;
  background: red;
}
<div class="full-height">
</div>