Table with fixed header

HTML

<div class='table'>
  <div class='header'>
  <div ><p class="vertical first">&nbsp;</p></div>
  <div ><p class="vertical">Republican</p></div>
      <div ><p class="vertical">Democrat</p></div>
      <div ><p class="vertical">Libertarian</p></div>
      <div ><p class="vertical">Green</p></div>
  </div>
  <div class='scroller'>
 <div class='content'>
    <div>
      <div>Alabama</div>
      <div>65</div>
      <div>25</div>
      <div>10</div>
      <div>0</div>
    </div>
    <div>
      <div>Alaska</div>
      <div>65</div>
      <div>25</div>
      <div>10</div>
      <div>0</div>
    </div>
    <div>
      <div>Arizona</div>
      <div>65</div>
      <div>25</div>
      <div>10</div>
      <div>0</div>
    </div>
    <div>
      <div>Arzkansas</div>
      <div>65</div>
      <div>25</div>
      <div>10</div>
      <div>0</div>
    </div>
    <div>
      <div>Arzkansas</div>
      <div>65</div>
      <div>25</div>
      <div>10</div>
      <div>0</div>
    </div>
      <div>
      <div>Arzkansas</div>
      <div>65</div>
      <div>25</div>
      <div>10</div>
      <div>0</div>
    </div>
  <div>
      <div>Arzkansas</div>
      <div>65</div>
      <div>25</div>
      <div>10</div>
      <div>0</div>
    </div>
    <div>
      <div>Arzkansas</div>
      <div>65</div>
      <div>25</div>
      <div>10</div>
      <div>0</div>
    </div>
    <div>
      <div>Arzkansas</div>
      <div>65</div>
      <div>25</div>
      <div>10</div>
      <div>0</div>
    </div>
    <div>
      <div>Arzkansas</div>
      <div>65</div>
      <div>25</div>
      <div>10</div>
      <div>0</div>
    </div>
    <div>
      <div>Arzkansas</div>
      <div>65</div>
      <div>25</div>
      <div>10</div>
      <div>0</div>
    </div>
    <div>
      <div>Arzkansas</div>
      <div>65</div>
      <div>25</div>
      <div>10</div>
      <div>0</div>
    </div>
    <div>
      <div>Arzkansas</div>
      <div>65</div>
      <div>25</div>
      <div>10</div>
      <div>0</div>
    </div>
...

CSS

html{
  overflow:hidden;
}
.table{
  height:300px;
  width:500px;
  
}
.vertical{
  transform: rotate(-90deg);
  width:56px;
  margin:0px;
}
.first{
  padding-right: 268px;
}
.header{
  height:150px;
  width:500px;
  display:flex;
}
.header>div{
    display:flex;
  }
  .scroller{
     height:calc(100% - 50px);
     overflow-y:scroll;
  }
  .content{
    width:100%;
    display:table;
  }
.content>div{
  display:table-row;
  width:500px;
}
.content>div>div{
  display:table-cell;
}