JSFiddle - React, Tailwind, and code Playground

by Milos Maric

HTML

<table class="table_scroll" border="1" style="margin-bottom:0;">
	    <thead>
	        <tr>
	            <th width="10%">Nalsov 1</th>
				<th width="10%">Naslov 2</th>
				<th width="15%">Naslov 3</th>
				<th width="30%">Naslov 4</th>
				<th width="30%">Naslov 5</th>
				<th width="5%" style=' padding:5px 0 5px 0;'>         Naslov6</th>
	        </tr>
	    </thead>
      <tbody>
          <tr>
              <td width='10%'>Celija 1</td>
              <td width='10%'>celija 2</td>
              <td width='15%'>Celija 3</td>
              <td width='30%'>Celija 4</td>
              <td width='30%'>celija 5</td>
              <td width='5%' style=' padding:5px 0 5px 0;'>celija 6</td>
          </tr>
          <tr>
              <td width='10%'>Celija 1</td>
              <td width='10%'>celija 2</td>
              <td width='15%'>Celija 3</td>
              <td width='30%'>Celija 4</td>
              <td width='30%'>celija 5</td>
              <td width='5%' style=' padding:5px 0 5px 0;'>celija 6</td>
          </tr>
          <tr>
              <td width='10%'>Celija 1</td>
              <td width='10%'>celija 2</td>
              <td width='15%'>Celija 3</td>
              <td width='30%'>Celija 4</td>
              <td width='30%'>celija 5</td>
              <td width='5%' style=' padding:5px 0 5px 0;'>celija 6</td>
          </tr>
          <tr>
              <td width='10%'>Celija 1</td>
              <td width='10%'>celija 2</td>
              <td width='15%'>Celija 3</td>
              <td width='30%'>Celija 4</td>
              <td width='30%'>celija 5</td>
              <td width='5%' style=' padding:5px 0 5px 0;'>celija 6</td>
          </tr>
          <tr>
              <td width='10%'>Celija 1</td>
              <td width='10%'>celija 2</td>
              <td width='15%'>Celija 3</td>
              <td width='30%'>Celija 4</td>
              <td width='30%'>celija 5</td>
              <td width='5%' style=' padding:5px 0 5px 0;'>celija 6</td>
        ...

CSS

.table_scroll{
    padding: 0;
    margin: 0;
  /*  width: 100%;  /* Optional */*/
    border-collapse: collapse; 
    border-spacing: 0;
    /*border: 1px solid black;*/
}


table.table_scroll tbody,
table.table_scroll thead { display: block; background-color: #8CB1DA; width:100%; }
table.table_scroll thead tr th { 
    padding: 0px;
    height: 20px;
    line-height: 20px;
    /* text-align: left; */
}

table.table_scroll tbody {
    height: 100px;
    overflow-y: auto;
    overflow-x: hidden;
    background-color: white;
}

table.table_scroll tbody td, thead th {
     padding: 0;
    margin: 0;
    border:0;
    /* width: 20%; */ /* Optional */
    border-right: 1px solid black;
    /* white-space: nowrap; */
}

table.table_scroll tbody td:last-child, thead th:last-child {
    border-right: none;
}

table.table_scroll tbody tr td a {
        display: block;
}