Table Heading

Semantic ui table

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.7/semantic.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.7/semantic.min.js"></script>
<div class="ui grid">
  <div class="row">
    <div class="one column wide"></div>
    <div class="fourteen wide column">
      <div class="ui raised segment">
        <a class="ui red ribbon label">Demo</a>
        <div class="ui divider"></div>

        <div class="ui grid">
          <table class="ui small compact table" id="dataSink">
            <thead class="header">
              <tr class="center aligned">
                <th>ABC</th>
                <th>BBB</th>
                <th>CCC</th>
                <th>FFF</th>
                <th>GGG</th>
                <th>HHH</th>
                <th>III</th>
                <th>JJJ</th>
                <th>111</th>
                <th>222</th>
              </tr>
            </thead>
            <tbody>
              <tr class="center aligned">
                <td>
                  <button class="mini ui button">5</button>
                </td>
                <td>
                  <button class="mini ui button">5</button>
                </td>
                <td>
                  <button class="mini ui button">5</button>
                </td>
                <td>
                  <button class="mini ui button">5</button>
                </td>
                <td>
                  <button class="mini ui button">5</button>
                </td>
                <td>
                  <button class="mini ui button">5</button>
                </td>
                <td>
                  <button class="mini ui button">5</button>
                </td>
                <td>
                  <button class="mini ui button">5</button>
                </td>
                <td>
                  <button class="mini ui...

CSS

#dataSink td {
   border: 0px;
 }
  #dataSink {
    table-layout:fixed;
    border-collapse: collapse;
  }
 
 #dataSink tr {
   border: 0px;
 }
 
 #dataSink tbody {
   display: block;
   overflow-y: auto;
   height: 220px;
 }
 
 #datasink thead tr {
   display: block;
   position: relative;
 }