Question

我会说明。我有这个相当简单的网站，我有三个按钮/链接，我在其中一个元素（id为“content”的部分）中进行了diplay（带有一点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 for it：

.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%;
}

如何让网站占据整个元素？

1 个答案: