header

main

        html, body, header, main, nav, footer{
            box-sizing: border-box;
            margin: 0; padding: 0;
            border: 1px solid red;
        }
        
        html{
            width: 100%;
            height: 100%; 
        }
        
        body{ 
            width: 940px; /* 幅を指定 1920/2 - 20 = 940 */
            margin: 0 auto; /* 上下マージン 0 ，左右マージン自動 */
            height: 100%; 
        }
        
        header{
            width: 100%;
            height: 100px;
        }
        
        main{ 
            padding: 1rem;
            float: right; 
            width: 80%;
            height: calc(100% - 100px - 2rem); 
            overflow: auto;
        }
        
        nav{ 
            float: left; 
            width: 20%;
            height: calc(100% - 100px - 2rem); 
            overflow: auto;
        }
        
        footer{ 
            clear: both; 
            height: 2rem;
        }