在通过Angular项目在浏览器中打开的所有页面上，底部始终有一个白色的条

Question

我的Angular项目有问题 我不知道为什么，页面底部总是有白色条带 约三分之一的浏览器页面 我尝试使用CSS进行更改，但该栏始终停留在该处 无论是否存在引导程序类，都会发生这种情况 当我使用Google Chrome Inspect Element工具检查页面时，此栏显示在HTML标签外部

<div class=" container-fluid">
<div class="row">
  <div class="col-lg-2 col-xs-1 bg-warning" id="player">1</div>
  <div class="col-lg-8 col-xs-1" id="main">
    <div class="row">
        <app-ai-deck></app-ai-deck>
    </div>
    <div class="row" >
        <div class="col-lg-1 col-xs-1 bg-primary"></div>
        <div class="col-lg-11 col-xs-11 bg-warning"><app-ai-row-a></app-ai-row-a></div>
    </div>
    <div class="row">
        <div class="col-lg-1 col-xs-1 bg-primary"></div>
        <div class="col-lg-11 col-xs-11 bg-warning"><app-ai-row-b></app-ai-row-b></div>  
    </div>
    <div class="row">
        <div class="col-lg-1 col-xs-1 bg-primary"></div>
        <div class="col-lg-11 col-xs-11 bg-warning"><app-ai-row-c></app-ai-row-c></div>    
    </div>
    <div class="row"><app-buffer></app-buffer></div>
    <div class="row">
        <div class="col-lg-1 col-xs-1 bg-primary"></div>
        <div class="col-lg-11 col-xs-11 bg-warning"><app-row-c></app-row-c></div>
    </div>
    <div class="row">
        <div class="col-lg-1 col-xs-1 bg-primary"></div>
        <div class="col-lg-11 col-xs-11 bg-warning"> <app-row-b></app-row-b></div>
    </div>
    <div class="row">
      <div class="col-lg-1 col-xs-1 bg-primary"></div>
      <div class="col-lg-11 col-xs-11 bg-warning"> <app-row-a></app-row-a></div>
    </div>
    <div class="row"><app-deck></app-deck></div>
  </div>
  <div class="col-lg-2 col-xs-1 bg-info" id="ai" >1</div>
</div>
</div>