如何使一個網站占據整個元素？

Question

我會指定。 我有一個相當簡單的網站，在該網站上我有三個按鈕/鏈接，它們在其中一個元素（id為“ content”的部分）中顯示（帶有JS的一點魔力）。 它工作正常，但由於某種原因，它幾乎（而且是一個很大的）都只能在左上角的小窗口中顯示，並帶有向下滾動條，而我無法使其占據整個“部分” 。

我得到的JS是：

function load_projects() {
        document.getElementById("content").innerHTML='<object type="text/html" data="projects.html" ></object>';
        }

和一個元素：

<section class="box sect shadow" id="content">  
</section>

CSS的：

.box {
    background-color: #D3D3D3;
    width: 1000px;
    height: 600px;
    margin-right: 20%;
    margin-left: 20%;
    margin-top: 20px;
    border-radius: 20px;
}

.sect {
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
}

.shadow {
    -webkit-box-shadow: 10px 11px 31px -2px rgba(120,124,125,0.61);
    -moz-box-shadow: 10px 11px 31px -2px rgba(120,124,125,0.61);
    box-shadow: 10px 11px 31px -2px rgba(120,124,125,0.61);
}

因此，總結一下：我有一個帶有三個按鈕/鏈接的“ nav”元素，它們顯示在“ section”元素中，但是要占據“ section”鏈接的整個表面，這是在一個小的向下滾動的窗口中顯示的。 我究竟做錯了什么？ 我該如何解決？

Answer 1

您尚未為要添加的對象指定任何樣式，因此它不知道填充容器元素。

添加以下CSS ...

#content object {
    height: 100%;
    width: 100%;
}