我正在尝试使用整页Angular Material选项卡,其中包含完整高度且具有居中消息的选项卡 . 我已经创建了this stakblitz因为我可以想要在每个标签内强制高度,因为这似乎打败了灵活布局的点 .
我肯定它很简单,但帮助一个穷困惑的开发人员习惯Bootstrap网格:)
UPDATE 添加高度:计算(100vh - 100px);到父div,然后也到tall.component div让事情有效但是 surely this is a bad solution
我正在尝试使用整页Angular Material选项卡,其中包含完整高度且具有居中消息的选项卡 . 我已经创建了this stakblitz因为我可以想要在每个标签内强制高度,因为这似乎打败了灵活布局的点 .
我肯定它很简单,但帮助一个穷困惑的开发人员习惯Bootstrap网格:)
UPDATE 添加高度:计算(100vh - 100px);到父div,然后也到tall.component div让事情有效但是 surely this is a bad solution
1 回答
为了填充页面,页面需要填充窗口:
styles.css
应用程序组件需要填充正文:
app.component.css
默认情况下,选项卡内容的包装器不会填充选项卡的高度,因此我们将解决此问题:
styles.css
我们还需要让
mat-tab-group
填充高度,它的父级也需要填充高度,因此我们将为包装器和制表符组提供一个id .app.component.ts
app.component.css
https://stackblitz.com/edit/angular-awamwn?file=src%2Fapp%2Fapp.component.html