我有两个iFrame在我的HTML网站的每一页的时刻。我想iFrame的高度，根据屏幕大小进行调整。我想iFrame的底部，以遵循屏幕的底部（上方。页脚），以确保该网站是在所有的屏幕分辨率和iFrame高度填充屏幕的其余部分呈现。
我已经尝试将.main和.sideBar的位置设置为相对位置，并将iFrame的位置设置为绝对位置，将框架的高度和宽度设置为100%，但这似乎仍然不起作用。我真的需要帮助来找到解决这个问题的方法。
你可以看到，在我的CSS代码中使用固定的min-heights 11.4%为.frameMain和#newsmyEd它完全适合我的12”计算机的屏幕。iFrames包含在.main和.sideBar中，我已经设置了5000 px的固定高度。你可以看到，虽然当网站显示在不同的分辨率，iFrame被缩短，并且不像我想实现的那样向下到.footbar上方的底部。
x1c 0d1x的数据

的
附件是我的代码：

/* Copyright (c) myEd (made by students, for students.) 2018. */

body { /* General Body Properties */
    font-family: Trebuchet MS, Georgia, Helvetica, sans-serif;
    margin: 0;
    overflow: hidden;
}

* { /* Key element to aligning <divs> (DO NOT REMOVE) */
    box-sizing: border-box;
}

#wrapper {
    bottom: 0;
    left: 0;
    overflow: hidden;
    position: absolute;
    right: 0;
    top: 0
}

.header { /* Header properties featuring myEd and school emblems */
    padding: 30px;
    text-align: center; /* Aligns links in the navBar */
    background-image: url(/Default/Img/backgroundHeader-4K.jpg);
    background-size: cover;
    background-repeat: no-repeat;
}

.myEd-reverse {
    width: 240px;
    height: 70px;
    float: left;
    margin-left: -60px;
    margin-top: -40px;
}

.navBar { /* Sticky navBar, either relative or fixed, depending on the scroll position of the site */
    overflow: hidden;
    background-color: #333;
    position: sticky;
    position: -webkit-sticky;
    top: 0;
    z-index: 100000;
}

.navBar a { /* Style the navBar links */
    float: left;
    display: block;
    color: #fff;
    text-align: center;
    padding: 6px 12px;
    text-decoration: none;
}

.navBar a.right { /* Float Quick Links, Help and Log-out navBar directory items to the right of the navBar */
    float: right;
}

.navBar a:hover { /* Change color on hover */
    background-color: #ddd;
    color: #000;
}

.navBar a.active { /* Active Link */
    background-color: #666;
    color: #fff;
}

.modalDialog { /* Modal Properties for all modals in myEd */
    position: fixed;
    font-family: Trebuchet MS, Georgia, Helvetica, sans-serif;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0,0,0,0.8);
    z-index: 99999;
    opacity:0;
    -webkit-transition: opacity 400ms ease-in;
    -moz-transition: opacity 400ms ease-in;
    transition: opacity 400ms ease-in;
    pointer-events: none;
}

.modalDialog:target { /* Modal Properties for all modals in myEd */
    opacity:1;
    pointer-events: auto;
}

.modalDialog > div { /* Modal Properties for all modals in myEd */
    width: 400px;
    position: relative;
    margin: 10% auto;
    padding: 5px 20px 13px 20px;
    border-radius: 10px;
    background: #d7d7d7;
    background: -moz-linear-gradient(#ddd, #666);
    background: -webkit-linear-gradient(#ddd, #666);
    background: -o-linear-gradient(#ddd, #666);
}

.close { /* Modal Properties for all modals in myEd */
    background: #606061;
    color: #FFFFFF;
    line-height: 10px;
    position: absolute;
    right: -5px;
    text-align: center;
    top: -10px;
    width: -5px;
    text-decoration: none;
    font-weight: bold;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    border-radius: 12px;
    -moz-box-shadow: 1px 1px 3px #000;
    -webkit-box-shadow: 1px 1px 3px #000;
    box-shadow: 1px 1px 3px #000;
}

.close:hover { background: #00d9ff; } /* Modal Properties for all modals in myEd */

.textModalh2 { /* Text preferences of the modal box directed from the navBar */
    margin-top: 18px;
    margin-bottom: -15px;
}

.textModalh5 { /* Text preferences of the modal box directed from the navBar */
    margin-bottom: -15px;
}

.CARTHmodal { /* Image preferences of CARTH in the modal box directed from the navBar */
    border-radius: 50%; 
    height: 130px; 
    width: 120px;
    float: left;
    margin-right: 40px;
    margin-top: 15px
}

.row { /* Alignment between sideBar and main */
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.sideBar { /* sideBar alignment properties */
    -ms-flex: 20%;
    flex: 20%;
    background-color: #a7a7a7;
    padding: 0px;
    height: 5000px; /* As standard to work on all screen resolutions, overflow hides excess */
    overflow-y: scroll; /* Allows myEd news to scroll */
    overflow: hidden;
}

#newsmyEd {
    width: 100%;
    height: 11.4%;
    min-height: 11.4%;
    top: 0;
    right: 0;
}

.main { /* Main Column */
    -ms-flex: 80%;
    flex: 80%;
    background-color: #a7a7a7;
    padding: 0px;
    height: 5000px; /* As standard to work on all screen resolutions, overflow hides excess */
    overflow-y: scroll; /* Allows embedded iFrame to scroll */
    position: relative;
    overflow: hidden;
}

.frameMain { /* Frame Properties */
    position: absolute;
    top: 0;
    left: 0;
    border: 0;
    min-height: 11.4%;
}

.footer { /* Footer properties */
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #333;
}

.footer a { /* Footer navBar properties */
    float: right;
    display: block;
    color: #fff;
    text-align: center;
    padding: 6px 12px;
    text-decoration: none;
}

.footer a:hover { /* Change color on hover */
    background-color: #ddd;
    color: #000;
}

.footer a.active { /* Active Link */
    background-color: #666;
    color: #fff;
} 

@media screen and (max-width: 700px) { /* Responsive Layout - If screen px is less than 700px, make sideBar and main stack on top of each other */
    .row {   
        flex-direction: column;
    }
}

@media screen and (max-width: 400px) { /* Responsive Layout - If screen px is less than 400px, make navBar links stack vertically on top of each other */
    .navBar a {
        float: none;
        width: 100%;
    }
}

个字符
谢谢你的帮忙。