HTML生成空格
HTML生成空格
提问于 2018-06-05 05:01:44
我正在用Angular 2和PrimeNG设计框架开发一个页面。而创建一个由菜单栏和内容部分组成的简单布局时，应将其放置在菜单下方，并填充整个剩余空间。但不管怎样，正如你在图片上看到的那样，底部有一个缺口，我不能解释为什么。
这是我的HTML代码
#siteContainer {
height: 100%;
width: 100%;
display: table-row;
}
#menuContainer {
display: table-row;
}
#p-tabView {
height: 100%;
}<div id="siteWrapper" style="min-height: 100%; width: 100%; display: table">
<!-- Top Menu Bar -->
<div id="menuContainer">
<app-skeleton></app-skeleton>
</div>
<!--Container for site content-->
<div id="siteContainer">
<p-tabView id="tabView" orientation="bottom">
<div id="tabPanelContainer">
<p-tabPanel>
<!--tabbody-->
<p-card>
<app-display-widgets style="{border: #7A7A7A 2em solid;}" *ngIf="sheet.id === refreshCurrentSheet()" [dashboardID]="dashboard.id"></app-display-widgets>
</p-card>
</p-tabPanel>
</div>
</p-tabView>
</div>
</div>
回答 3
Stack Overflow用户
发布于 2018-06-05 05:06:18
将margin:0添加到html和body标记中
<style>
html, body{
margin: 0;
}
#siteContainer {
height: 100%;
width: 100%;
display: table-row;
background: blue;
}
#menuContainer{
display: table-row;
}
#p-tabView {
height: 100%;
}Stack Overflow用户
发布于 2018-06-05 05:08:18
将此代码添加到您的代码中，看看这是否可以解决问题
body {
margin:0;
padding:0;
}Stack Overflow用户
发布于 2018-06-05 06:29:55
检查您的路由器插座是否包装在容器流体中，如果是，请根据您的喜好更改容器的流体css或移除包装div/容器
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50688717
复制相关文章
相似问题
腾讯云开发者
