JSFiddle - React, Tailwind, and code Playground

by seevis

HTML

<div class="ktoonlinehaalbaza">

  <table>
    <tbody>
      <tr>
        <td colspan="2"><div class="haalgrupy">
        {GROUP_LEGEND}
        </div></td>
      </tr>
      <tr>
        <td><div class="haalqueelram1">
        {TOTAL_POSTS}<br />
          {TOTAL_USERS}<br />
          {NEWEST_USER}
        </div></td>
        <td><div class="haalqueelram1">
        {L_WHOSBIRTHDAY_TODAY}<br>
          {L_WHOSBIRTHDAY_WEEK}
        </div>
          </td>
      </tr>
      <tr>
        <td><div class="haalqueelram2">
        {TOTAL_USERS_ONLINE}<br />
          {RECORD_USERS}<br />
          {LOGGED_IN_USER_LIST}
        </div></td>
        <td><div class="haalqueelram2">
        {L_CONNECTED_MEMBERS}
        </div></td>
      </tr>
    </tbody>
  </table>
</div>

CSS

.ktoonlinehaalbaza {
  width: 810px;
  padding: 4px;
  font-size: 10px;
}


.haalgrupy {
  font-size: 21pt;
  text-align: center;  
}

.haalqueelram1 {
  border: 1px solid #141529;
  padding: 2px;
  width: 403px;
  height: 40px;
}

.haalqueelram2 {
  border: 1px solid #141529;
  padding: 2px;
  width: 403px;
  height: 80px;
  overflow-y: auto;
  scrollbar-width: thin;
  text-align: justify;
}