상위 요소가 높이 100 % 인 경우에도 Div가 100 % 높이가되지 않습니다.

표시 할 두 개의 div가 있습니다. 그래서 그들은 나란히 놓여 있고 display : table-row를위한 행 div; 마지막으로 display : table;이있는 #main div. 모든 부모 요소의 높이는 100 %이지만 #main div는 이동하지 않습니다. 나는 그것을 고치기 위해 내가 생각할 수있는 모든 것을 시도했고 내가 놓친 단순한 것을 바랐다. 아래는 내 코드입니다.

스타일

* {
    margin: 0px;
    padding: 0px;
}
html, body {
    height: 100%;
}

#container {
    position: relative;
    min-height: 100%;
}

header {
    background: #1A446C;
    width: 100%;
    height: 50px;
    padding: 2% 0 0 2%;
}
header h1 {
    color: #D4E6F4;
    font-size: 25px;
}

#main {
    background: #FDE8A5;
    display: table;
    width: 100%;
    height: 100%;
    /*padding-bottom: 50px;*/
    border: 1px solid red;
}
#row {
    display: table-row;
    height: 100%;
}
nav {
    background: #8D0D19;
    display: table-cell;
    width: 16%;
    height: 100%;
    padding: 0 2% 0 2%;
}
nav ul {
    margin: 0px 0px 0px 15px;
}
nav ul li {
    color: #FFF;
}

#page {
    display: table-cell;
    width: 76%;
    height: 100%;
    padding: 0 2% 0 2%;
}
#page ul {
    margin: 0px 0px 0px 35px;
}
#page h2, #page p {
    margin: 0px 0px 15px 0px;
}

footer {
    background: #1A446C;
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    height: 20px;
    padding: 15px 0px 15px 0px;
    color: #D4E6F4;
    text-align: center;
    clear: both;
}

HTML

    <div id="container">
        <header>
            <h1>Header</h1>
        </header>

        <div id="main">
            <div id="row">
                <nav>
                    <ul>
                        <li><a href="#">Nav 1</a></li>
                        <li><a href="#">Nav 2</a></li>
                        <li><a href="#">Nav 3</a></li>
                    </ul>
                </nav>

                <div id="page">
                    <h2>Manage Content</h2>

                    <p>Content</p>
                </div>
            </div>
        </div>

        <footer>
            <p>Copyright 2015, </p>
        </footer>
    </div><!-- This Close Container -->
</body>